Constructing a Multi-Tenant SaaS Software with Subsequent.js (Backend Integration) — SitePoint

I constructed a useful multi-tenant SaaS software (an EdTech app) together with your on a regular basis tech instrument and you are able to do the identical.

First, what’s a multi-tenant SaaS software?

Multi-tenant SaaS functions allow you to serve a number of prospects from a single codebase. However to do that, you’ll have to handle safe and tenant-specific entry, and this may be difficult when achieved manually. That’s why I made a decision to make use of Allow, a contemporary authorization instrument that simplifies this course of.

On this article, I’ll present you methods to simplify authorization to your SaaS functions utilizing Allow, with a step-by-step instance of constructing a demo app that includes tenant isolation and role-based entry management (RBAC) with Subsequent.js and Appwrite.

What are Subsequent.js and Appwrite, and why do we’d like them?

Subsequent.js

Subsequent.js is a React-based framework that gives server-side rendering (SSR), static website era (SSG), API routes, and efficiency optimizations out of the field.

For this venture, I used Subsequent.js as a result of:

• It permits pre-rendering of pages, which improves efficiency and search engine marketing.
• Its built-in routing makes it simple to handle web page transitions and dynamic content material.
• It integrates simply with backend providers like Appwrite and Allow.io for authentication and authorization.

Appwrite

Appwrite is a backend-as-a-service (BaaS) platform that gives person authentication, databases, storage, and serverless features. Utilizing a service like Appwrite eliminates the necessity to construct a backend from scratch, so you possibly can deal with frontend growth whereas gaining access to backend capabilities.

For this venture, I used Appwrite:

• To deal with person registration, login, and session administration.
• To supply a structured NoSQL database to retailer tenant-specific information.

Utilizing Subsequent.js and Appwrite collectively allowed me to create a scalable, high-performance multi-tenant SaaS app whereas holding the event course of environment friendly.

Introduction to Multi-Tenant SaaS Authorization

A multi-tenant SaaS app is software program that serves a number of customers or teams of customers, referred to as tenants, utilizing a single software program occasion of the appliance.

What it means is that in a multi-tenant SaaS structure, a number of prospects (tenants) share the identical software infrastructure or use the identical software however keep information isolation.

A sensible instance of it is a venture administration instrument like Trello.

• It’s a single infrastructure that runs on shared servers and has the identical codebase for all its customers.
• Every firm utilizing Trello (e.g., Firm A and Firm B) is a tenant.
• It isolates information:
  • Staff of Firm A can solely see their initiatives, duties, and boards.
  • Staff of Firm B can’t entry or view Firm A’s information, and vice versa.

This ensures that whereas sources are shared, every tenant’s information and actions are non-public and safe.

In a multi-tenant software, even inside a tenant, some customers may have increased entry to some data, whereas some members will likely be restricted to sure sources.

Authorization in such functions should:

• Guarantee customers can’t entry different tenants’ or prospects’ information or sources. That is referred to as isolating tenants.
• Guarantee customers inside a tenant can entry solely sources their roles allow by offering granular entry management.
• Deal with extra customers, tenants, and roles with out slowing down or degrading efficiency.

Significance of tenant isolation and granular entry management

Tenant isolation retains information safe by guaranteeing that every buyer’s data stays non-public. Whereas granular entry management ensures customers inside a company solely get the permissions they want.

Implementing authorization in your SaaS apps may be advanced and tough, nevertheless it doesn’t must be when you may have an authorization instrument like Allow.

What’s Allow, and what are its advantages?

Allow is an easy-to-use authorization instrument for managing entry in any software, together with multi-tenant apps. Utilizing Allow.io in your software lets you simply outline and assign roles with particular permissions for entry management inside your software. Except for creating roles throughout the software, you can too add circumstances and guidelines based mostly on person or useful resource attributes to specify what every person can and can’t do.

Now that most of what you’ll want to learn about Allow and its advantages, let’s get into the principle deal—constructing a SaaS software with Subsequent.js and integrating Allow for authorization.

To reveal the ability of Allow, we’ll be constructing a multi-tenant Edtech SaaS platform.

Constructing an EdTech SaaS platform includes a number of challenges, together with person authentication, role-based entry management (RBAC), and multi-tenancy. We’ll use Subsequent.js for the frontend, Appwrite for authentication and database administration, and Allow for fine-grained authorization.

Tech Stack Overview

System Structure

The appliance follows a backend-first method:

1. Backend (Node.js + Categorical)
   • Handles API requests and enterprise logic.
   • Makes use of Appwrite for authentication and database administration.
   • Implements Allow for authorization, defining roles and permissions.
   • Ensures each request is validated earlier than information entry.
2. Frontend (Subsequent.js)
   • Connects to the backend to fetch information securely.
   • Makes use of role-based UI rendering, that means customers solely see what they’re approved to entry.
   • Restricts actions (like creating assignments) based mostly on permissions.

By implementing authorization on the API stage, we be certain that customers can’t bypass restrictions, even when they manipulate the frontend.

On the finish of this information, you’ll have a totally useful multi-tenant EdTech SaaS app, the place:

• Admins can add and think about college students.
• Lecturers can add and think about college students, in addition to create assignments.
• College students can solely view their assigned coursework.

This text supplies a step-by-step breakdown of how I applied Allow to deal with authorization to construct this venture, so comply with alongside and construct yours.

Backend Implementation with Allow

To implement role-based entry management (RBAC) and tenant isolation, we have to:

1. Arrange Allow and outline roles, tenants, and insurance policies.
2. Combine Allow within the backend (Node.js + Categorical).
3. Shield API routes utilizing middleware that checks permissions earlier than permitting requests.

Let’s go step-by-step.

1. Organising Allow

Earlier than writing any code, you’ll want to

You may be introduced with the onboarding, however when you enter your group identify, you possibly can simply skip the setup.

• Create a useful resource and actions

Navigate to the coverage part, the place you’ll create a useful resource and actions that you would be able to carry out on that useful resource.

As soon as you might be achieved creating your sources, it ought to appear like this:

After creating the sources, navigate to the Roles web page utilizing the Roles tab. You’ll see that some roles have mechanically been assigned.

Delete these roles and create new roles. Every position may have particular guidelines related to it, about what a person can and can’t do. Create the Admin position first, as it can later function a constructing block for the RBAC circumstances. Click on the Add Function button on the high and create the roles.

When you find yourself achieved creating your roles, it ought to appear like this:

Nice!

Now that you’ve created your sources and roles, now you can configure permissions within the coverage editor.

• Configuring permissions within the coverage editor

Return to the Coverage Editor and that is what the roles will appear like now, with every particular person useful resource outlined and the actions that you would be able to choose. You’re now prepared to offer permissions to the roles to carry out the chosen actions on the useful resource.

When you find yourself achieved deciding on the actions for every position, click on the Save adjustments button on the backside proper of the web page.

Lastly, to make use of the cloud PDP of Allow, you’ll want the API key of your present setting. For this venture you’ll be utilizing the event setting key. Proceed to Settings and click on API Keys, scroll all the way down to Setting API keys, click on “Reveal Key,” then copy it.

After organising your Allow dashboard, now you can transfer on to your backend.

2. Putting in dependencies

To get began, you’ll have to have Node.js put in in your laptop. After guaranteeing Node.js is put in in your system, comply with these steps:

• Begin by creating a brand new venture utilizing the next instructions:

mkdir backend
cd backendNpm init -y

• Then, set up the next packages:

npm set up specific dotenv permitio cors appwwrite axios jsonwebtoken

• Configure Allow in Categorical. In your .env file, retailer your API key:

PERMIT_API_KEY=your-permit-key-you-copied-earlier

3. Organising Appwrite

• Go to Appwrite and create a brand new venture by inputting a venture identify and deciding on a area. Observe down your Challenge ID and API Endpoint; that’s what you’ll enter because the values in your .env file. Your ENV file ought to be wanting like this:

PERMIT_API_KEY=your-permit-key-you-copied-earlier
APPWRITE_ENDPOINT=https://cloud.appwrite.io/v1
APPWRITE_PROJECT_ID=your-project-id

• Now proceed to databases to create your database, then copy your database ID to stick it into your ENV file.

Your ENV file ought to now be wanting like this:

PERMIT_API_KEY=your-permit-key-you-copied-earlier
APPWRITE_ENDPOINT=https://cloud.appwrite.io/v1
APPWRITE_PROJECT_ID=your-project-id
APPWRITE_DATABASE_ID=your-database-id

Now create the next collections within the Appwrite Database with the next attributes:

What your ENV file ought to be wanting like at this level:

PERMIT_API_KEY=your-permit-key-you-copied-earlier
PERMIT_PROJECT_ID=copy-from-dashboard
PERMIT_ENV_ID=copy-from-dashboard
APPWRITE_ENDPOINT=https://cloud.appwrite.io/v1
APPWRITE_PROJECT_ID=your-project-id
APPWRITE_DATABASE_ID=your-database-id
APPWRITE_PROFILE_COLLECTION_ID=your-id
APPWRITE_ASSIGNMENTS_COLLECTION_ID=your-id
APPWRITE_STUDENTS_COLLECTION_ID=your-id
JWT_SECRET=generate-this-by-running//openssl rand -base64 16
PORT=8080

4. Create file construction and information

Now create a src folder within the root of the file. Then generate the tsconfig.json file within the root folder and paste the next code into it:

{
    "compilerOptions": {
      "goal": "ES6",
      "module": "commonjs",
      "outDir": "./dist",
      "esModuleInterop": true,
      "forceConsistentCasingInFileNames": true,
      "strict": true,
      "skipLibCheck": true,
      "resolveJsonModule": true,
      "baseUrl": "./",
      "paths": {
        "@/*": ["src/*"]
      }
    },
    "embrace": ["src/**/*"],
    "exclude": ["node_modules", "dist"]
  }

This tsconfig.json configures the TypeScript compiler to focus on ES6, use CommonJS modules, and output information to ./dist. It enforces strict type-checking, allows JSON module decision, units up path aliases for src, and excludes node_modules and dist from compilation.

Within the src folder, create the next folders: api, config, controllers, middleware, fashions, and utils.

• Utils folder
  • Now, create a brand new allow.ts file within the utils folder venture to initialize Allow utilizing the next code:

import { Allow } from 'permitio';
import { PERMIT_API_KEY } from '../config/setting';


const allow = new Allow({
  
  token: PERMIT_API_KEY, 
  
  pdp: 'https://cloudpdp.api.allow.io', 
  
  log: {
    stage: "debug",
  },
  
  
  
});

export default allow;

This file initializes Allow’s SDK for Node.js, connecting it to the Allow PDP container utilizing an API key saved within the setting. It configures logging for debugging and units up the SDK to deal with errors silently until explicitly configured to throw them.

• Subsequent, create a file referred to as errorHandler.ts and paste the next code:

import { Request, Response, NextFunction } from 'specific';

export const errorHandler = (err: any, req: Request, res: Response, subsequent: NextFunction) =>  500).json( 'Inside Server Error',
  );
;

This file defines an Categorical error-handling middleware that logs errors and sends a JSON response with the error message and standing code. It defaults to a 500 standing code if no particular standing is supplied.

• Fashions folder
  • Create a file referred to as profile.ts and paste the next code:

export interface Profile  'Instructor' 

This file defines a TypeScript Profile interface with properties for identify, electronic mail, position, and userId, the place position is restricted to particular values: Admin, Instructor, or Pupil.

• Create project.ts file and paste the next code:

import { database, ID } from '../config/appwrite';
import { DATABASE_ID, ASSIGNMENTS_COLLECTION_ID } from '../config/setting';

export interface AssignmentData {
  title: string;
  topic: string;
  className: string;
  trainer: string;
  dueDate: string;
  creatorEmail: string;
}


export async perform createAssignmentInDB(information: AssignmentData) {
    return await database.createDocument(
      DATABASE_ID,
      ASSIGNMENTS_COLLECTION_ID,
      ID.distinctive(),
      information
    );
}


export async perform fetchAssignmentsFromDB() {
  const response = await database.listDocuments(DATABASE_ID, ASSIGNMENTS_COLLECTION_ID);
  return response.paperwork;
}

This file supplies features to work together with an Appwrite database for managing assignments. It defines an AssignmentData interface and contains features to create a brand new project and fetch all assignments from the database.

• Create a scholar.ts file and paste the next code:

import { database, ID, Permission, Function, Question } from '../config/appwrite';
import { DATABASE_ID, STUDENTS_COLLECTION_ID } from '../config/setting';

export interface StudentData  'Boy' 


export async perform createStudentInDB(information: StudentData) {
    return await database.createDocument(
      DATABASE_ID,
      STUDENTS_COLLECTION_ID,
      ID.distinctive(),
      information,
      [
        Permission.read(Role.any()),  
      ]
    );
}


export async perform fetchStudentsFromDB() {
  const response = await database.listDocuments(DATABASE_ID, STUDENTS_COLLECTION_ID);
  return response.paperwork;
}

This file supplies features to handle scholar information in an Appwrite database. It defines a StudentData interface and contains features to create a brand new scholar with public learn permissions and fetch all college students from the database.

• Middleware folder
  • Create auth.ts file and paste the next code:

import { Request, Response, NextFunction } from 'specific';
import jwt from 'jsonwebtoken';


interface AuthenticatedRequest extends Request {
  person?: {
    id: string;
    position: string;
  };
}

const authMiddleware = (req: AuthenticatedRequest, res: Response, subsequent: NextFunction): void => {
  const token = req.headers.authorization?.cut up(' ')[1];

  if (!token) {
    res.standing(401).json({ error: 'Unauthorized. No token supplied' });
    return
  }

  strive {
    const decoded = jwt.confirm(token, course of.env.JWT_SECRET!) as { id: string; position: string };
    req.person = decoded;
    subsequent();
  } catch (error) {
    res.standing(403).json({ error: 'Invalid token' });
    return
  }
};

export default authMiddleware;

This file defines an Categorical middleware for JWT-based authentication. It checks for a legitimate token within the request header, verifies it utilizing a secret key, and attaches the decoded person data (ID and position) to the request object. If the token is lacking or invalid, it returns an applicable error response.

• Create allow.ts and paste the next code:

import allow from '../utils/allow';

export const checkUsertoPermitStudents = async (electronic mail: string, motion: string, useful resource: string): Promise<boolean> => {
  strive {
    const permitted = await allow.test(electronic mail, motion, useful resource);
    console.log("Permitted", permitted);
    return permitted;
  } catch (error) {
    console.error(`Error syncing person ${electronic mail} to Allow.io:`, error);
    return false;
  }
};

export const checkUserToPermitAssignment = async (electronic mail: string, motion: string, useful resource: string): Promise<boolean> => {
  strive {
    const permitted = await allow.test(electronic mail, motion, useful resource);
    console.log("Permitted", permitted);
    return permitted;
  } catch (error) {
    console.error(`Error syncing person ${electronic mail} to Allow.io:`, error);
    return false;
  }
};

This file defines utility features, checkUsertoPermitStudents and checkUserToPermitAssignment, to test person permissions in Allow for particular actions and sources. Each features deal with errors gracefully, logging points and returning false if the permission test fails. They’re used to implement authorization within the software.

• Controllers folder
  • Create auth.ts file and paste the next code:

import { account, ID } from '../config/appwrite';
import { Request, Response } from 'specific';
import jwt from 'jsonwebtoken';

const JWT_SECRET = course of.env.JWT_SECRET as string; 


export const signUp = async (req: Request, res: Response) => {
  const { electronic mail, password, identify } = req.physique;

  if (!electronic mail || !password || !identify) {
    return res.standing(400).json({ error: 'Identify, electronic mail, and password are required.' });
  }

  strive {
    const person = await account.create(ID.distinctive(), electronic mail, password, identify);
    
    const token = jwt.signal({ electronic mail }, JWT_SECRET, { expiresIn: '8h' });
      res.cookie('token', token, {
        httpOnly: true,
        sameSite: 'strict',
        safe: true,
      });

    res.standing(201).json({ success: true, person, token });
  } catch (error: any) {
    console.error('Signal-up Error:', error);
    res.standing(500).json({ success: false, message: error.message });
  }
};


export const login = async (req: Request, res: Response) => {
  const { electronic mail, password } = req.physique;

  if (!electronic mail || !password) {
    return res.standing(400).json({ error: 'E-mail and password are required.' });
  }

  strive {
    const session = await account.createEmailPasswordSession(electronic mail, password);

    
    const token = jwt.signal(
      { userId: session.userId, electronic mail }, 
      JWT_SECRET,
      { expiresIn: '8h' }
    );

    res.cookie('token', token, {
      httpOnly: true,
      sameSite: 'strict',
      safe: true,
    });

    res.standing(200).json({ success: true, token, session });
  } catch (error: any) {
    console.error('Login Error:', error);
    res.standing(401).json({ success: false, message: error.message });
  }
};


export const logout = async (req: Request, res: Response) => {
  strive {
    await account.deleteSession('Present Session ID');
    res.clearCookie('token');
    res.standing(200).json({ success: true, message: 'Logged out efficiently' });
  } catch (error: any) {
    console.error('Logout Error:', error);
    res.standing(500).json({ success: false, message: error.message });
  }
};

This file defines authentication controllers for sign-up, login, and logout, integrating with Appwrite for person administration and JWT for session dealing with. The signUp and login controllers validate enter, create person periods, and generate JWTs, whereas the logout controller clears the session and token. All controllers deal with errors and return applicable responses.

• Create project.ts file and paste the next code:

import { Request, Response } from 'specific';
import { createAssignmentInDB, AssignmentData, fetchAssignmentsFromDB } from '../fashions/project';
import { checkUserToPermitAssignment } from '../middleware/allow';


export async perform createAssignment(req: Request<{}, {}, AssignmentData>, res: Response): Promise<void> {
    strive {
        const { title, topic, trainer, className, dueDate, creatorEmail }: AssignmentData = req.physique;

        const isPermitted = await checkUserToPermitAssignment(creatorEmail, "create", "assignments");
        if (!isPermitted) {
            res.standing(403).json({ error: 'Not approved' });
            return;
        }

        const newAssignment = await createAssignmentInDB({
            title,
            topic,
            trainer,
            className,
            dueDate,
            creatorEmail
        });

        console.log('New project created:', newAssignment);

        res.standing(201).json(newAssignment);
    } catch (error) {
        console.error('Error creating project:', error);
        res.standing(500).json({ error: (error as any).message });
    }  
}


export async perform fetchAssignments(req: Request, res: Response): Promise<void> {
    strive {
        const { electronic mail } = req.params;
       
        const isPermitted = await checkUserToPermitAssignment(electronic mail, "learn", "assignments");
        if (!isPermitted) {
            res.standing(403).json({ message: 'Not approved' });
            return;
        }

        const assignments = await fetchAssignmentsFromDB();
        res.standing(200).json(assignments);
    } catch (error) {
        res.standing(500).json({ error: (error as any).message });
    }
}

This file defines controllers for creating and fetching assignments to combine with a database and Allow for authorization checks. The createAssignment controller validates enter, checks permissions, and creates a brand new project, whereas the fetchAssignments controller retrieves all assignments after verifying entry. Each controllers deal with errors and return applicable responses.

• Create a scholar.ts file and paste the next code:

import {
    createStudentInDB,
    fetchStudentsFromDB,
    StudentData
} from '../fashions/scholar';
import { Request, Response } from 'specific';
import { checkUsertoPermitStudents } from '../middleware/allow';

export async perform createStudent(req: Request, res: Response): Promise<void> {
    strive {
        const { firstName, lastName, gender, className, age, creatorEmail }: StudentData = req.physique;

        if (!['girl', 'boy'].contains(gender)) {
            res.standing(400).json({ error: 'Invalid gender kind' });
            return;
        }

        const isPermitted = await checkUsertoPermitStudents(creatorEmail, "create", "college students");
        if (!isPermitted) {
            res.standing(403).json({ message: 'Not approved' });
            return;
        }

        const newStudent = await createStudentInDB({
            firstName,
            lastName,
            gender,
            className,
            age,
            creatorEmail
        });
        res.standing(201).json(newStudent);
    } catch (error) {
        res.standing(500).json({ error: (error as any).message });
    }  
}


export async perform fetchStudents(req: Request, res: Response): Promise<void> {
    strive {
        const { electronic mail } = req.params;

        const isPermitted = await checkUsertoPermitStudents(electronic mail, "learn", "college students");
        if (!isPermitted) {
            res.standing(403).json({ message: 'Not approved' });
            return;
        }

        const college students = await fetchStudentsFromDB();
        res.standing(200).json(college students);
    } catch (error) {
        res.standing(500).json({ error: (error as any).message });
    }
}

This file defines controllers for creating and fetching college students, integrating with a database and Allow for authorization checks. The createStudent controller validates enter, checks permissions, and creates a brand new scholar, whereas the fetchStudents controller retrieves all college students after verifying entry. Each controllers deal with errors and return applicable responses.

• Create a profile.ts file and paste the next code:

import { Profile } from '@/fashions/profile';
import axios from 'axios';
import { database, ID, Question } from '../config/appwrite';
import { Request, Response, NextFunction, RequestHandler } from 'specific';
import { PERMIT_API_KEY } from '../config/setting';

const profileId = course of.env.APPWRITE_PROFILE_COLLECTION_ID as string; 
const databaseId = course of.env.APPWRITE_DATABASE_ID as string; 
const projectId = course of.env.PERMIT_PROJECT_ID as string
const environmentId = course of.env.PERMIT_ENV_ID as string

const PERMIT_API_URL = `https://api.allow.io/v2/information/${projectId}/${environmentId}/customers`;
const PERMIT_AUTH_HEADER = {
  Authorization: `Bearer ${PERMIT_API_KEY}`,
  "Content material-Sort": "software/json",
};


export const createProfile: RequestHandler = async (req: Request, res: Response, subsequent: NextFunction): Promise<void> => {
  const { firstName, lastName, electronic mail, position, userId } = req.physique;
  console.log(req.physique);

  if (!electronic mail || !position || !userId) {
    res.standing(400).json({ error: 'FirstName, lastName, electronic mail, position, and userId are required.' });
    return;
  }

  
  const allowedRoles: Profile['role'][] = ['Admin', 'Teacher', 'Student'];
  if (!allowedRoles.contains(position)) {
    res.standing(400).json({ error: 'Invalid position. Allowed roles: admin, trainer, scholar' });
    return;
  }

  strive {
    const newUser = await database.createDocument(
      databaseId,
      profileId,
      ID.distinctive(),
      { firstName, lastName, electronic mail, position, userId }
    );
    
    const permitPayload = {
      key: electronic mail,
      electronic mail,
      first_name: firstName,
      last_name: lastName,
      role_assignments: [{ role, tenant: "default" }],
    };

    let permitResponse;
    strive {
      const response = await axios.submit(PERMIT_API_URL, permitPayload, { headers: PERMIT_AUTH_HEADER });
      permitResponse = response.information;
      console.log("Consumer synced to Allow.io:", permitResponse);
    } catch (permitError) {
      if (axios.isAxiosError(permitError))  else {
        console.error("Did not sync person to Allow.io:", permitError);
      }
      permitResponse = { error: "Did not sync with Allow.io" };
    }

    
    res.standing(201).json({
      message: "Consumer profile created efficiently",
      person: newUser,
      allow: permitResponse,
    });
    return;
  } catch (error: any) {
    res.standing(500).json({ success: false, message: error.message });
    return;
  }
};


export const getProfileByEmail = async (req: Request, res: Response, subsequent: NextFunction): Promise<void> => {
  const { electronic mail } = req.params;
   
  if (!electronic mail) {
    res.standing(400).json({ error: 'E-mail is required.' });
    return;
  }

  strive {
    const profile = await database.listDocuments(
      databaseId,
      profileId,
      [Query.equal("email", email)]
    );

    if (profile.paperwork.size === 0) {
      res.standing(404).json({ error: 'Profile not discovered' });
      return;
    }

    res.standing(200).json({ success: true, profile: profile.paperwork[0] });
  } catch (error: any) {
    console.error('Error fetching profile:', error);
    res.standing(500).json({ success: false, message: error.message });
  }
};

This file defines controllers for creating and fetching person profiles, integrating with Appwrite for database operations and Allow for position synchronization. The createProfile controller validates enter, creates a profile, and syncs the person to Allow, whereas the getProfileByEmail controller retrieves a profile by electronic mail. Each controllers deal with errors and return applicable responses.

• Config Folder
  • Create appwrite.ts file and paste the next code:

import { Shopper, Account, Databases, Storage, ID, Permission, Function, Question } from 'appwrite';
import { APPWRITE_ENDPOINT, APPWRITE_PROJECT_ID, APPWRITE_API_KEY } from './setting';


const shopper = new Shopper()
  .setEndpoint(APPWRITE_ENDPOINT) 
  .setProject(APPWRITE_PROJECT_ID); 


if (APPWRITE_API_KEY) {
  (shopper as any).config.key = APPWRITE_API_KEY;  
}


const account = new Account(shopper);
const database = new Databases(shopper);
const storage = new Storage(shopper);


export { shopper, account, database, storage, ID, Permission, Function, Question };

This file initializes and configures the Appwrite shopper with the venture endpoint, ID, and non-compulsory API key. It additionally units up and exports Appwrite providers like Account, Databases, and Storage, together with utility constants like ID, Permission, Function, and Question.

• Create setting.ts file and paste the next code:

import dotenv from 'dotenv';
dotenv.config();  

export const APPWRITE_ENDPOINT = course of.env.APPWRITE_ENDPOINT || '';
export const PERMIT_API_KEY = course of.env.PERMIT_API_KEY || '';
export const PERMIT_PROJECT_ID = course of.env.PERMIT_PROJECT_ID || '';
export const PERMIT_ENV_ID = course of.env.PERMIT_ENV_ID || '';
export const APPWRITE_PROJECT_ID = course of.env.APPWRITE_PROJECT_ID || '';
export const DATABASE_ID = course of.env.APPWRITE_DATABASE_ID || '';
export const STUDENTS_COLLECTION_ID = course of.env.APPWRITE_STUDENTS_COLLECTION_ID || '';
export const ASSIGNMENTS_COLLECTION_ID = course of.env.APPWRITE_ASSIGNMENTS_COLLECTION_ID || '';

export const PROFILE_COLLECTION_ID = course of.env.APPWRITE_PROFILE_COLLECTION_ID || '';

This file hundreds setting variables from a .env file and exports them as constants to be used within the software, resembling Appwrite and Allow configurations, database IDs, and assortment IDs. Default values are supplied as fallbacks if the setting variables are usually not set.

• API folder
  • Create scholar.ts and paste the next code:

import specific from 'specific';
import { createStudent, fetchStudents } from '../controllers/scholar';
import authMiddleware from '../middleware/auth';

const router = specific.Router();


router.submit('/college students', authMiddleware, createStudent); 
router.get('/college students/:electronic mail', authMiddleware, fetchStudents); 
export default router; 

This file units up an Categorical router with endpoints for managing scholar information. It contains routes for creating a brand new scholar and fetching college students, each protected by an authentication middleware (authMiddleware). The router is then exported to be used within the software.

• Create auth.ts file and paste the next code:

import specific from 'specific';
import { signUp, login, logout } from '../controllers/auth';

const router = specific.Router();


router.submit('/signup', (req, res, subsequent) => { 
    signUp(req, res).then(() => {
      subsequent();
    }).catch((err) => {
      subsequent(err);
    });
});
router.submit('/login', (req, res, subsequent) => { 
    login(req, res).then(() => {
      subsequent();
    }).catch((err) => {
      subsequent(err);
    });
});
router.submit('/logout', logout); 
export default router; 

This file units up an Categorical router with endpoints for authentication-related actions, together with person signup, login, and logout. The signup and login routes deal with asynchronous operations with error dealing with, whereas the logout route is easy. The router is exported to be used within the software.

• Create project.ts file and paste the next code:

import specific from "specific"
import { createAssignment, fetchAssignments } from "../controllers/project"
import authMiddleware from "../middleware/auth"

const router = specific.Router()

router.submit("/create", authMiddleware, createAssignment)
router.get("/:electronic mail", authMiddleware, fetchAssignments)
export default router

This file units up an Categorical router with endpoints for managing assignments. It contains routes for creating an project and fetching assignments, each protected by an authentication middleware (authMiddleware). The router is exported to be used within the software.

• Create profile.ts file and paste the next code:

import specific from 'specific';
import { createProfile, getProfileByEmail } from '../controllers/profile';
import authMiddleware from '../middleware/auth';

const router = specific.Router();


router.submit('/profile', authMiddleware, createProfile);


router.get('/profile/:electronic mail', authMiddleware, getProfileByEmail);
export default router;

This file units up an Categorical router with endpoints for managing person profiles. It contains routes for making a profile and fetching a profile by electronic mail, each protected by an authentication middleware (authMiddleware). The router is exported to be used within the software.

• Create index.ts file and paste the next code:

import specific, { Request, Response } from 'specific';
import dotenv from 'dotenv';
import cors from 'cors';  
import authRoutes from './auth';  
import profileRoutes from './profile';
import studentRoutes from './scholar';
import assignmentRoutes from './project';
import { errorHandler } from '../utils/errorHandler';  

dotenv.config();  

const app = specific();
const PORT = course of.env.PORT || 8080;


app.use(cors());  
app.use(specific.json());  


app.use('/api/auth', authRoutes);  
app.use('/api', profileRoutes); 
app.use('/api', studentRoutes); 
app.use('/api/assignments', assignmentRoutes); 


app.use(errorHandler);  


app.get("https://www.sitepoint.com/", (req: Request, res: Response) => {
  res.ship('Appwrite Categorical API');
});


app.pay attention(PORT, () => {
  console.log(`Server is operating on port ${PORT}`);
});
export default app;

This file units up an Categorical server, configuring middleware like CORS and JSON parsing, and mounts routes for authentication, profiles, college students, and assignments. It features a international error handler and a default route to substantiate the server is operating. The server listens on a specified port, logs its standing, and exports the app occasion for additional use.

• Lastly, to run this venture, change part of package deal.json and set up the next packages beneath so whenever you run npm run dev, it really works.

npm set up concurrently ts-node nodemon --save-dev

• By updating the scripts within the package deal.json, whenever you begin the server, the typescript information are compiled to JavaScript in a brand new folder that’s mechanically created referred to as dist

"scripts": {
    "dev": "concurrently "tsc --watch" "nodemon -q --watch src --ext ts --exec ts-node src/api/index.ts"",
    "construct": "tsc",
    "begin": "node ./dist/api/index.js"
},

Now run npm run dev to begin your server. While you see this message, it means that you’ve efficiently applied the backend.

Congratulations, your backend is prepared for requests.

Now that our backend is ready up, transfer on to frontend integration, the place you’ll:

• Safe API requests from Subsequent.js
• Dynamically present/disguise UI components based mostly on person permissions.

Purpose for creating an intensive backend service utilizing Appwrite

Appwrite is usually described as a backend-as-a-service (BaaS) answer, that means it supplies ready-made backend performance like authentication, database administration, and storage with out requiring builders to construct a standard backend.

Nonetheless, for this venture, I wanted extra flexibility and management over how information was processed, secured, and structured, which led me to create an intensive customized backend utilizing Node.js and Categorical whereas nonetheless leveraging Appwrite’s providers.

As a substitute of relying solely on Appwrite’s built-in API calls from the frontend, I designed a Node.js backend that acted as an middleman between the frontend and Appwrite. This allowed me to:

• Implement fine-grained entry management with Allow.io earlier than forwarding requests to Appwrite.
• Construction API endpoints for multi-tenancy to make sure tenant-specific information isolation.
• Create customized enterprise logic, resembling processing role-based actions earlier than committing them to the Appwrite database.
• Preserve a centralized API layer, making it simpler to implement safety insurance policies, log actions, and scale the appliance.

Appwrite supplied the core authentication and database performance of this software, however this extra backend layer enhanced safety, flexibility, and maintainability, to make sure strict entry management earlier than any motion reached Appwrite.

Conclusion

That’s it for half one among this text sequence. Partially 2, we’ll deal with the frontend integration by organising API calls with authorization, initializing and putting in mandatory dependencies, writing out the element file codes, and dealing with state administration & routes.