[IMAGE: https://cdn.utopian.io/posts/93930e3e21cbe7977c6a1432bcfe6504b9acNode-Serve-Static.png]
New Projects
About Node-Serve-Static
Builded using NodeJS, is solution to serve static site, especially routes that are rendered from the client side.
More and more websites are using static sites, especially since ReactJS, VueJS, Angular and some other libraries or frameworks are beginning to dominate the market.
Not many service managers support to serve routers from static sites. Inspired by Netlify Redirect, created the same system and easy to configure, this is the beginning of this project.
Before and After
I have a sample static site builded using ReactJS and React-Router. Initially fine when opening the homepage, but when switching to another path and user doing reload, this is what happened.
Before using node-serve-static
Failed render page, and return 404.
After using node-serve-static
[IMAGE: https://camo.githubusercontent.com/b00318e66ea3f6c61b6fba3757def6ab57334170/687474703a2f2f7265732e636c6f7564696e6172792e636f6d2f64686a6b6b746d616c2f696d6167652f75706c6f61642f76313532323436303331352f6769746875622f53637265656e5f53686f745f323031382d30332d33315f61745f30382e33382e31362e706e67]
Success render page and return 200.
How to Use
First make sure your static site is ready and fully worked. And then clone this repo repo. You are free to put it either outside or inside the static site.
And then open server.js, the contents of the static file path. You can input booth absolute or relative.
const DIR_STATIC = __dirname + '/sample_site';
Start development mode using command
npm run start
And please check in your favorite browser.. Site will runing on default port 3000.
Roadmap
In future versions, will be provided instalable for node-serve-static, and is available especially for some of the world's existing website servers. There is no need to tamper with code to configure static sites, just create _redirects as already implemented Netlify.
How to contribute?
Fork repo that is linked below, You can act as developer, user or tester. To make it easy to manage, be sure to make an issue first before working on the feature, and be sure to mention the issue when pulling the request.
If you want to work on the issue, please provide comments in advance, so as not done by other developers, thus avoiding conflict codes.
Link
- Github : https://github.com/yussan/node-serve-static
Posted on Utopian.io - Rewarding Open Source Contributors