Local authentication example with express and nextjs using TypeScript.
Mongodb instance running, either locally or from an online service.
# In root directory
npm i
⚠ See section bugs.
# In root directory
npm run dev
# In root directory
npm run build
You need to run the build script first!
# In root directory
npm start
- TypeScript
- Express
- Mongoose
- Jest
- Passport
- JWT
- React
- Redux
- gulp
I was searching for an example project doing exactly what i wanted. Authentication between NextJS Frontend and Express Backend using TypeScript. I found an project which is splitted in Back and Frontend, but it wasn't written with TypeScript. So I decided to rewrite it in TypeScript and also add some testing.
- You can't run the development Server for the Frontend, you have to build the production Server and start that one.
unhandledRejection: MongoNetworkError: failed to connect to server [localhost:27017] on first connect [Error: connect ECONNREFUSED 127.0.0.1:27017
at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1056:14) {
name: 'MongoNetworkError',
errorLabels: [Array],
[Symbol(mongoErrorContextSymbol)]: {}
}]
If you get this error Message, you will most probably not have an instance of Mongo DB running or you have a wrong mongo url in your config file.
As a reminder, a mongodb url has to look at least like this: mongodb://<ip>:<port>
.
Error: Cannot find module './config'
If you get this error Message, you need to create a config file under api/src/config.ts
with the following content.
export const db: string = "mongodb://localhost:27017/authenticationApi"; // Mongo DB URL
export const port: string = "8000"; // API Server Port
export const secret: string = "my-super-duper-mega-secret-secret"; // Secret for the passport strategy
If you have a local Mongo DB instance running, you may encounter the problem, that mongod tells you, that the key is to large.
In this case you need to start mongod with the option --setParameter failIndexKeyTooLong=false
.
Failed to compile.
./src/redux/actions/authActions.ts
Module not found: Can't resolve '../../../config' in ...
If you get this error Message, you need to create a config file under www/config.ts
with the following content.
export const API: string = 'http://localhost:8000';
- Daniel Nagel - danielsenpai95gmail.com