An open API service indexing awesome lists of open source software.

https://github.com/basedhound/auth-cookie-session_next

This project demonstrates cookie-based authentication and authorization in a Next.js 14 app with the app router, using Iron-Session for session management and TypeScript for type safety.
https://github.com/basedhound/auth-cookie-session_next

auth iron-session nextjs nextjs14 react react18 typescript

Last synced: 5 months ago
JSON representation

This project demonstrates cookie-based authentication and authorization in a Next.js 14 app with the app router, using Iron-Session for session management and TypeScript for type safety.

Awesome Lists containing this project

README

        



Project Banner

Auth Cookie Session - Next.js 14


##
đź“‹ Table of Contents

- ✨ [Introduction](#introduction)
- ⚙️ [Tech Stack](#tech-stack)
- 📝 [Features](#features)
- 🚀 [Quick Start](#quick-start)

##
✨ Introduction

**[EN]** This project demonstrates cookie-based authentication and authorization in a Next.js 14 app using the app router. It utilizes Iron-Session for managing cookie sessions and integrates with TypeScript for type safety. This setup provides a straightforward approach to implementing authentication in Next.js, showcasing best practices for secure and efficient session management.

**[FR]** Cette solution illustre l'authentification et l'autorisation basées sur des cookies dans une application Next.js 14 en utilisant le routeur de l'application. Elle utilise Iron-Session pour la gestion des sessions par cookies et s'intègre avec TypeScript pour une sécurité de type. Cette configuration offre une approche simple pour mettre en œuvre l'authentification dans Next.js, en mettant en avant les meilleures pratiques pour une gestion sécurisée et efficace des sessions.

##
⚙️ Tech Stack

- [**React**](https://react.dev/reference/react) is a popular JavaScript library for building user interfaces, particularly single-page applications where data changes over time. React's component-based architecture allows developers to create reusable UI components, making development more efficient and the codebase easier to maintain.

- [**Next.js**](https://nextjs.org/docs) is a React framework known for its server-side rendering (SSR) and static site generation (SSG) capabilities, enhancing performance and SEO for web applications. It offers features like automatic code splitting, API routes for server-side logic, and a plugin system for extensibility.

- [**TypeScript**](https://www.typescriptlang.org/docs/) is a statically typed superset of JavaScript that allows for early detection of errors and more robust, maintainable code. TypeScript's type system helps developers catch mistakes early during the development process, ensuring a more stable and reliable application.

- [**Iron-Session**](https://www.npmjs.com/package/iron-session/v/8.0.0-beta.5) is a TypeScript library for managing session data in Next.js applications using cookies. It provides a secure way to handle session storage by encrypting and signing cookies to prevent tampering and ensure data integrity. Iron-Session simplifies session management with easy-to-use APIs for creating, retrieving, and updating session data. It integrates seamlessly with Next.js and TypeScript, offering type-safe session handling without relying on additional libraries.

- [**Cookie Session**](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies) is a method of managing user sessions in web applications using cookies. It involves storing session data directly in the browser’s cookies, which are sent with each HTTP request. This approach enables stateful authentication and tracking without server-side storage. Cookie sessions are simple to implement and widely supported but require careful management of cookie security, including encryption and proper expiration settings, to prevent unauthorized access and data breaches.

##
🚀 Quick Start

Follow these steps to set up the project locally on your machine.


**Prerequisites**

Make sure you have the following installed on your machine:

- [Git](https://git-scm.com/)
- [Node.js](https://nodejs.org/en)
- [npm](https://www.npmjs.com/) (Node Package Manager)


**Cloning the Repository**

```bash
git clone {git remote URL}
```


**Installation**

Let's install the project dependencies, from your terminal, run:

```bash
npm install
# or
yarn install
```


**Set Up Environment Variables**

Create a new file named `.env` in the root of your project and add the following content:

```env
SECRET_KEY=
```


**Running the Project**

Installation will take a minute or two, but once that's done, you should be able to run the following command:

```bash
npm run dev
# or
yarn dev
```

Open [`http://localhost:3000`](http://localhost:3000) in your browser to view the project.