Lucas Pereira de Souza

Posted on Jan 22

Tauri 2.0: Desktop Apps with Rust

#node #rust #softwaredevelopment #typescript

## Mastering Cross-Platform: Lightweight and Secure Apps with TypeScript and Node.js

In today's software development landscape, the need to reach a broad audience across multiple platforms (web, mobile, desktop) is increasingly pressing. However, the temptation to opt for native approaches for each platform can lead to high costs, duplicated efforts, and sometimes, an inconsistent user experience. This is where cross-platform applications come in, and the goal of this post is to guide you in creating solutions that not only share code across platforms but also excel in being lightweight and secure.

The Cross-Platform Challenge: More Than Just Sharing Code

Developing for multiple platforms might seem like a panacea, but it hides pitfalls. The pursuit of a single codebase often results in heavy frameworks, complex abstraction APIs that mask platform-specific nuances, and in many cases, security vulnerabilities originating from the architecture itself. A \"lightweight\" application isn't just about the final bundle size; it also refers to its runtime performance and ease of maintenance. Security, on the other hand, is not an \"extra\" but a fundamental pillar from the project's inception.

The Dynamic Duo: TypeScript and Node.js on the Backend

To build robust cross-platform applications, we've chosen a technology stack that prioritizes clarity, security, and performance:

TypeScript: As a superset of JavaScript, TypeScript adds optional static typing to JavaScript. This means we can catch many errors at compile time, even before the code reaches production. For a backend, this translates to more predictable code that's easier to refactor and less prone to unexpected bugs.
Node.js: With its asynchronous, event-driven model, Node.js is ideal for building scalable network applications. Its vast community and package ecosystem (npm) offer solutions for virtually any need.

Building a Secure and Lightweight Backend with TypeScript and Node.js

Let's dive into practical examples. Imagine we're building a simple API to manage users, focusing on security and good architecture.

1. Project Structure and Best Practices

A well-defined project structure is the first step towards organized and maintainable code.

// src/
// ├── config/         # Application configuration (e.g., environment variables)
// │   └── index.ts
// ├── controllers/    # Logic for handling HTTP requests
// │   └── user.controller.ts
// ├── models/         # Data definitions and database interactions
// │   └── user.model.ts
// ├── routes/         # API route definitions
// │   └── user.routes.ts
// ├── services/       # Business logic
// │   └── user.service.ts
// ├── utils/          # Utility functions
// │   └── logger.ts
// ├── app.ts          # Application entry point
// └── server.ts       # HTTP server configuration

2. Strong Typing for Security and Clarity

Using interfaces and types in TypeScript helps us ensure that the data entering and leaving our API is in the expected format.

// src/models/user.model.ts

/**
 * Interface defining the structure of a user.
 * Ensures all users have the specified properties.
 */
export interface User {
  id: string;
  username: string;
  email: string;
  createdAt: Date;
}

/**
 * Interface for creating a new user's data.
 * Excludes 'id' and 'createdAt' as they are server-generated.
 */
export interface CreateUserDto {
  username: string;
  email: string;
}

/**
 * Interface for updating a user's data.
 * All properties are optional to allow for partial updates.
 */
export interface UpdateUserDto {
  username?: string;
  email?: string;
}

3. Controllers: Secure Request Handling

Controllers are responsible for receiving HTTP requests, validating input data (using DTOs), and calling the appropriate services.

// src/controllers/user.controller.ts
import { Request, Response } from 'express';
import { UserService } from '../services/user.service';
import { CreateUserDto, UpdateUserDto, User } from '../models/user.model';
import { logger } from '../utils/logger';

export class UserController {
  constructor(private userService: UserService = new UserService()) {}

  /**
   * Creates a new user.
   * Validates input data using CreateUserDto.
   * @param req - Express request object.
   * @param res - Express response object.
   */
  async createUser(req: Request, res: Response): Promise<void> {
    const userData: CreateUserDto = req.body;

    // Basic validation (in production, use libraries like Zod or class-validator)
    if (!userData.username || !userData.email) {
      logger.warn('Attempt to create user with incomplete data.');
      res.status(400).json({ message: 'Username and email are required.' });
      return;
    }

    try {
      const newUser: User = await this.userService.createUser(userData);
      logger.info(`User created successfully: ${newUser.username}`);
      res.status(201).json(newUser);
    } catch (error) {
      logger.error(`Error creating user: ${error.message}`);
      res.status(500).json({ message: 'Internal server error while creating user.' });
    }
  }

  /**
   * Gets a user by ID.
   * @param req - Express request object.
   * @param res - Express response object.
   */
  async getUserById(req: Request, res: Response): Promise<void> {
    const { id } = req.params;

    try {
      const user: User | null = await this.userService.getUserById(id);
      if (user) {
        logger.info(`User found: ${user.username}`);
        res.status(200).json(user);
      } else {
        logger.warn(`User with ID ${id} not found.`);
        res.status(404).json({ message: 'User not found.' });
      }
    } catch (error) {
      logger.error(`Error fetching user ${id}: ${error.message}`);
      res.status(500).json({ message: 'Internal server error while fetching user.' });
    }
  }

  /**
   * Updates an existing user.
   * Validates input data using UpdateUserDto.
   * @param req - Express request object.
   * @param res - Express response object.
   */
  async updateUser(req: Request, res: Response): Promise<void> {
    const { id } = req.params;
    const updateData: UpdateUserDto = req.body;

    // Check if there is any data to update
    if (Object.keys(updateData).length === 0) {
      logger.warn(`Attempt to update user ${id} with no data.`);
      res.status(400).json({ message: 'No data provided for update.' });
      return;
    }

    try {
      const updatedUser: User | null = await this.userService.updateUser(id, updateData);
      if (updatedUser) {
        logger.info(`User ${id} updated successfully.`);
        res.status(200).json(updatedUser);
      } else {
        logger.warn(`User with ID ${id} not found for update.`);
        res.status(404).json({ message: 'User not found.' });
      }
    } catch (error) {
      logger.error(`Error updating user ${id}: ${error.message}`);
      res.status(500).json({ message: 'Internal server error while updating user.' });
    }
  }

  /**
   * Deletes a user by ID.
   * @param req - Express request object.
   * @param res - Express response object.
   */
  async deleteUser(req: Request, res: Response): Promise<void> {
    const { id } = req.params;

    try {
      const success = await this.userService.deleteUser(id);
      if (success) {
        logger.info(`User ${id} deleted successfully.`);
        res.status(204).send(); // 204 No Content is appropriate for successful deletions
      } else {
        logger.warn(`User with ID ${id} not found for deletion.`);
        res.status(404).json({ message: 'User not found.' });
      }
    } catch (error) {
      logger.error(`Error deleting user ${id}: ${error.message}`);
      res.status(500).json({ message: 'Internal server error while deleting user.' });
    }
  }
}

4. Services: Centralized and Secure Business Logic

Services contain the core business logic. Here, we can implement more complex validations and database interactions. For security, we avoid directly exposing database implementation details and focus on providing a clear API.

// src/services/user.service.ts
import { User, CreateUserDto, UpdateUserDto } from '../models/user.model';
import { v4 as uuidv4 } from 'uuid'; // Example of UUID library usage

// In-memory database simulation for this example
const usersDatabase: Map<string, User> = new Map();

export class UserService {
  /**
   * Creates a new user in the \"database".
   * @param userData - Data of the user to be created.
   * @returns The created user.
   */
  async createUser(userData: CreateUserDto): Promise<User> {
    const newUser: User = {
      id: uuidv4(), // Generates a unique ID
      username: userData.username,
      email: userData.email,
      createdAt: new Date(),
    };
    usersDatabase.set(newUser.id, newUser);
    return newUser;
  }

  /**
   * Fetches a user by their ID.
   * @param id - The ID of the user to fetch.
   * @returns The found user or null if not found.
   */
  async getUserById(id: string): Promise<User | null> {
    const user = usersDatabase.get(id);
    return user || null;
  }

  /**
   * Updates an existing user.
   * @param id - The ID of the user to update.
   * @param updateData - Partial data for the update.
   * @returns The updated user or null if not found.
   */
  async updateUser(id: string, updateData: UpdateUserDto): Promise<User | null> {
    const existingUser = usersDatabase.get(id);
    if (!existingUser) {
      return null;
    }

    // Apply updates securely
    const updatedUser = {
      ...existingUser,
      ...updateData,
      // Ensure fields like 'id' and 'createdAt' are not unintentionally overwritten
      id: existingUser.id,
      createdAt: existingUser.createdAt,
    };

    usersDatabase.set(id, updatedUser);
    return updatedUser;
  }

  /**
   * Deletes a user by their ID.
   * @param id - The ID of the user to delete.
   * @returns true if deletion was successful, false otherwise.
   */
  async deleteUser(id: string): Promise<boolean> {
    return usersDatabase.delete(id);
  }
}

// Note: In a real-world environment, you would use an ORM (like Prisma, TypeORM)
// or a database driver to interact with a persistent database.
// Data security (encryption, password hashing, etc.) would be implemented here.

5. Routes: Orchestrating Requests

Routes define the API endpoints and associate each endpoint with a controller method.

// src/routes/user.routes.ts
import { Router } from 'express';
import { UserController } from '../controllers/user.controller';

const router = Router();
const userController = new UserController();

// POST /users - Create new user
router.post('/', userController.createUser.bind(userController));

// GET /users/:id - Get user by ID
router.get('/:id', userController.getUserById.bind(userController));

// PUT /users/:id - Update user
router.put('/:id', userController.updateUser.bind(userController));

// DELETE /users/:id - Delete user
router.delete('/:id', userController.deleteUser.bind(userController));

export default router;

6. Entry Point and Server

app.ts configures middleware and routes, while server.ts starts the HTTP server.

// src/app.ts
import express, { Express, Request, Response, NextFunction } from 'express';
import cors from 'cors';
import helmet from 'helmet'; // Helps protect against common web vulnerabilities
import dotenv from 'dotenv';
import userRoutes from './routes/user.routes';
import { logger } from './utils/logger';

dotenv.config(); // Loads environment variables from .env file

const app: Express = express();

// Security Middlewares
app.use(cors()); // Configure CORS options as needed for production
app.use(helmet()); // Adds HTTP security headers

// Parsing Middlewares
app.use(express.json()); // For parsing JSON bodies
app.use(express.urlencoded({ extended: true })); // For parsing URL-encoded bodies

// Main user API route
app.use('/api/v1/users', userRoutes);

// Generic error handling middleware
app.use((err: Error, req: Request, res: Response, next: NextFunction) => {
  logger.error(`Unhandled error: ${err.message}`);
  res.status(500).json({ message: 'An unexpected server error occurred.' });
});

export default app;

// src/server.ts
import app from './app';
import { logger } from './utils/logger';

const PORT = process.env.PORT || 3000;

app.listen(PORT, () => {
  logger.info(`Server running on port ${PORT}`);
});

// src/utils/logger.ts
import winston from 'winston';

const logger = winston.createLogger({
  level: 'info',
  format: winston.format.combine(
    winston.format.timestamp(),
    winston.format.json()
  ),
  transports: [
    new winston.transports.Console(),
    // In production, you would add transports for files or logging services
    // new winston.transports.File({ filename: 'error.log', level: 'error' }),
    // new winston.transports.File({ filename: 'combined.log' }),
  ],
});

export { logger };

Additional Considerations for Lightweight and Security

Dependency Management: Keep your dependencies updated and use tools like npm audit to identify vulnerabilities. Remove unused packages.
Authentication and Authorization: Implement robust mechanisms like JWT (JSON Web Tokens) or OAuth2. On the backend, always validate tokens and check permissions before executing sensitive actions.
Input Validation: Never trust data coming from the client. Use dedicated libraries (like zod, class-validator) to rigorously validate all inputs.
Error Handling: Implement a centralized and robust error handling system. Avoid exposing sensitive error information to the client.
Rate Limiting: Protect your API against brute-force attacks and abuse by limiting the number of requests a client can make within a given period.
HTTPS: Always use HTTPS to encrypt communication between the client and the server.
Data Security: For sensitive data (passwords, personal information), use hashing (e.g., bcrypt) and appropriate encryption.

Conclusion: The Path to Successful Cross-Platform Applications

Creating lightweight and secure cross-platform applications is not an unattainable goal but rather the result of conscious architectural choices and the adoption of best practices. By leveraging the power of TypeScript for strong typing and the efficiency of Node.js for the backend, we build a solid foundation. Continuous attention to security, from data validation to robust authentication, ensures that your applications not only reach more users but do so reliably and securely. Remember: the journey to quality code is ongoing, and security should be a priority at every step of development.

DEV Community