mustansirzia / next-express-bootstrap-boilerplate

:zap: JavaScript boilerplate for a full stack app built using React.js, Next.js, Express.js, react-bootstrap, SCSS and full SSR with eslint.

”Premature optimization is the root of all evil, 97% of the time; Yet we should not pass opportunities in that critical 3%.” - David Knut

Here's My Introduction:

I’m (almost) a polyglot programmer who solves problems through code. I hate stereotyping and respect other people’s opinion in a workspace.
Even though I know it's not possible or feasible sometimes, but I'd still prefer writing clean code any day. And smart code isn't always clean 💡. I’m also always on a lookout for tools that improve my code and my workflow.

I really admire people who understand the value of time and respect flexibility among their colleagues. Remote work is one such example.

When I’m not pushing commits, I think about traveling the world and riding a bike with my wife.

Here's What I Do Professionally:

I'm part of geographically distributed team called ClearGlass. We are a fintech company that's trying to bring transparency in an industry that's been plagued by unfair costs. What we do could ultimately result in millions of people getting better returns for their lifetime of savings.

I spend most of my time authoring and maintaining ClearGlass's distributed backend.

Here's My Internet Footprint:

• I write all my blog posts here.
• I create or live stream videos and tutorials related to computer programming here.
• I post stuff on X here.
• I'm available on LinkedIn too, that's here.

Here Are My Top Repositories:

Here are My LeetCode Solutions:

I know! This is still a work in progress. ;)

Here is My StackOverflow Flair:

Here's How to Support Me:

• Support all my OSS work by buying me a coffee ☕.

next-express-bootstrap-boilerplate's Issues

Could not run nodemon

I'm facing this issue

[email protected] dev /home/shintaro/Desktop/projects/github/frontend
nodemon app.js

[nodemon] 1.19.0
[nodemon] reading config ./nodemon.json
[nodemon] to restart at any time, enter rs
[nodemon] or send SIGHUP to 20111 to restart
[nodemon] ignoring: ./node_modules//* ./.next//* ./app/**/*
[nodemon] watching: app.js
[nodemon] watching extensions: js,json
[nodemon] starting node app.js
[nodemon] forking
[nodemon] child pid: 20124
[nodemon] watching 1 file
Compiling ...

but when I made localhost:3000 - my port

it doesn't loads

I have updated nodemon and created thid nodemon .json

{
"verbose": true,
"ignore": ["node_modules", ".next","app/"],
"watch": ["app.js"],
"ext": "js json"
}

in package.json I have this

"dev": "nodemon -w app.js app.js"

Could you help me please...

Thanks
Carlos Vieira

Can't access rendering data into React component

Hi, in your example you send an object through render method:
app.get('/main', (req, res) => req.app.render(req, res, '/', { routeParam: req.params.routeParam }));
But how to access it after that?
I tried to retrieve it into getInitialProps method parameter but it's not there..
class Index extends React.Component { static async getInitialProps({ req }) { console.log(req.routeParam);

Using of pkg to transfrom in binary

HI there, thanks by the boilerplate
I'm using this package :https://github.com/zeit/pkg

and ran;

pkg app.js

[email protected]
Targets not specified. Assuming:
node10-linux-x64, node10-macos-x64, node10-win-x64

shintaro@shintaro-PC:~/Desktop/projects/github/frontend$ ./app-linux

Using "webpackDevMiddleware" config function defined in next.config.js.
[ error ] /snapshot/frontend/node_modules/next/dist/client/event-source-polyfill.js
Module not found: Can't resolve '@babel/runtime-corejs2/core-js/json/stringify' in '/snapshot/frontend/node_modules/next/dist/client'

I already remove the babelrc

can you help please or test this approach?

thanks
Carlos Vieira

Update to nextjs 9

HI there i ran the command npm i in order to install latest version of next js

but for now i can't run up the app...

did you tried the new version ?

Thanks
Carlos Vieira

npm run dev

> [email protected] dev /home/shintaro/Desktop/projects/github/frontend
> cd app && next

[ wait ]  starting the development server ...
[ info ]  waiting on http://localhost:3000 ...
> Using "webpackDevMiddleware" config function defined in next.config.js.
[ ready ] compiled successfully (ready on http://localhost:3000)
[ wait ]  compiling ...
[ ready ] compiled successfully (ready on http://localhost:3000)
[ event ] build page: /
[ wait ]  compiling ...
				^C
shintaro@shintaro-PC:~/Desktop/projects/github/frontend$ node
node     nodejs   nodemon  
shintaro@shintaro-PC:~/Desktop/projects/github/frontend$ node
node     nodejs   nodemon  
shintaro@shintaro-PC:~/Desktop/projects/github/frontend$ node app.js
> Using "webpackDevMiddleware" config function defined in next.config.js.
[ ready ] compiled successfully
[ wait ]  compiling ...
[ ready ] compiled successfully
[ event ] build page: /
[ wait ]  compiling ...

Issues on nodemon

Hi there I cant start nodemon... Can you check to please my rep in order to verify if something its wrong...?

How about an upgrade to version 9 ?
And the pkg?

Any result for your side.

Thanks

Issues on deploy to heroku

Hi there I'm trying to deploy to an heroku app
but it goes an error on node app.js

can you help me please?

i have tried too
"start": "next start -p $PORT",

Update to new Version?

Are there any plans to update to the latest nextjs Version?

Current app.js will not run on azure web app

If current version is deployed to Azure deployment will result in a 500.

After troubleshooting I found that changing const express = require('express');
`app.listen(port);
};

// Start the express server.
start(9001);`

to `app.listen(process.env.PORT);
};

// Start the express server.
start(9001);`

Makes repo run on Azure but then npm run start will not produce a running site locally.

How do I make this run both local and on Azure?

Sass Module Integration

Hi! Not an issue, but just wondering if you have any insight on how to get sass modules to work with this boilerplate. Any pointers would be greatly appreciated and thanks for this awesome boilerplate!

sudo npm i -g next-express-bootstrap-boilerplate does not work

I get this error why trying to run: sudo npm i -g next-express-bootstrap-boilerplate

Unhandled rejection Error: EISDIR: illegal operation on a directory, open '/Users/user/.npm/_cacache/content-v2/sha512/34/cd'

npm ERR! cb() never called!

log:
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node',
1 verbose cli '/usr/local/bin/npm',
1 verbose cli 'i',
1 verbose cli '-g',
1 verbose cli 'next-express-bootstrap-boilerplate' ]
2 info using [email protected]
3 info using [email protected]
4 verbose npm-session c117a29c64dd2f85
5 silly install loadCurrentTree
6 silly install readGlobalPackageData
7 timing npm Completed in 1240ms
8 error cb() never called!