DEV Community: hoangbui

🚀 My Enterprise React Boilerplate – Built from Lessons Learned in Real Projects

hoangbui — Sun, 10 Aug 2025 08:53:27 +0000

Hey devs 👋,

If you’ve ever kicked off a new React project for a big client or internal team, you know the drill:

Install dependencies
Set up Axios with interceptors
Configure Redux, React Query, routing, i18n, dark/light themes…
Spend a day fixing ESLint/Prettier configs
And then start writing actual features 😅

After doing this way too many times, I decided to bottle up all the boring setup into one boilerplate — so I can jump straight into building features.

Here it is:
🔗 GitHub Repo: Hoang21099/react-boilerplate

What You Get Out of the Box

⚡ React 18 + TypeScript for type-safe, modern apps
🛠 Vite for blazing-fast dev & builds
🎨 Tailwind CSS + dark/light theme switch
🔐 JWT-based authentication & role-based routes
📦 Redux Toolkit + RTK Query for state & API
🌍 i18n with English & Vietnamese
🛡 Error boundaries, protected routes, and graceful loading states

Why This Exists

When I was working on enterprise apps, the initial setup was always:

Copy configs from an old project
Update half the packages
Break something because configs were outdated
Spend hours debugging before writing real code

Now, I just git clone this repo and I’m ready to go in minutes.

Try It

git clone https://github.com/Hoang21099/react-boilerplate
cd react-boilerplate
yarn install
yarn dev

Edit .env for your API base URL, and you’re off to the races 🚀.

Final Thoughts

I built this for myself, but if it saves you time, that’s even better.
If you’ve got ideas to make it better — drop an issue or PR.
And if you like it, a ⭐ on GitHub means a lot ❤️.

Happy coding!
– Hoang

Building a Simple Redis Store with Node.js

hoangbui — Mon, 21 Oct 2024 15:38:14 +0000

Hey buddies! 👋

I’ve been playing around with Node.js and decided to create a lightweight in-memory key-value store that mimics a simple version of Redis. If you're looking to get started with networking in Node.js, or just love exploring fun side projects, this one’s for you!

🔑 Key Features:

Commands Supported:
- SET key value - Store key-value pairs.
- GET key - Retrieve the value of a key.
- DELETE key - Remove a key-value pair.
Uses Node.js's net module to create a TCP server for handling client connections.
A really simple redis store, great for quick tests or learning TCP interactions!

⚙️ Code Overview:

const net = require('net');

class SimpleRedis {
  constructor() {
    this.store = {};
  }

  set(key, value) {
    this.store[key] = value;
  }

  get(key) {
    return this.store[key] || null;
  }

  delete(key) {
    delete this.store[key];
  }
}

// Initialize store
const store = new SimpleRedis();

// Create a TCP server
const server = net.createServer((socket) => {
  console.log('Client connected');

  socket.on('data', (data) => {
    const command = data.toString().trim().split(' ');
    const action = command[0].toUpperCase();

    let response = '';

    switch (action) {
      case 'SET':
        const [key, value] = command.slice(1);
        store.set(key, value);
        response = `>> OK\n`;
        break;
      case 'GET':
        const keyToGet = command[1];
        const result = store.get(keyToGet);
        response = result ? `>> ${result}\n` : '>> NULL\n';
        break;
      case 'DELETE':
        const keyToDelete = command[1];
        store.delete(keyToDelete);
        response = `>> OK\n`;
        break;
      default:
        response = '>> Invalid command\n';
    }

    // Send the response with '>>'
    socket.write(response);
  });

  socket.on('end', () => {
    console.log('Client disconnected');
  });
});

// Start the server on port 3001
server.listen(3001, () => {
  console.log('Server is running on port 3001');
});

💡 What’s Happening:

The server listens on port 3001 and responds to SET, GET, and DELETE commands.
It’s super simple and straightforward—just send a command from any TCP client like telnet or netcat, and see your commands in action!

💻 To Try It Out:

Save the code as simpleRedis.js.
Run it with node simpleRedis.js.
Open a new terminal and connect to it using:

   telnet localhost 3001

Now, you can interact with your in-memory key-value store!

For example:

SET name Hoang
GET name
>> Hoang
DELETE name
GET name
>> NULL

Github
Give it a try! 😎 Let me know what you think or how you'd extend this.

Redis Singleton in Your Express Application

hoangbui — Tue, 06 Aug 2024 16:36:45 +0000

Hi guys !!!
Are you looking to optimize your Express application with efficient Redis usage? Look no further! In this post, we'll dive into implementing a Redis Singleton in your Express app to ensure a streamlined, efficient, and scalable caching solution. Let's enhance our applications together!

To create a Redis connection that is initialized once and reused throughout your Node.js Express application, you can use a singleton pattern. This ensures that only one instance of the Redis client is created and shared across different parts of your application.

1. Install Redis Client: First, make sure you have the Redis client library installed. You can use ioredis or redis. Here, we'll use ioredis.
npm install ioredis

2. Create a Redis Singleton Class:

// redisClient.js
const Redis = require('ioredis');

class RedisClient {
  constructor() {
    if (!RedisClient.instance) {
      this.client = new Redis({
        host: 'localhost', // Change to your Redis server host
        port: 6379,        // Change to your Redis server port
        // Add other Redis connection options if necessary
      });

      this.client.on('connect', () => {
        console.log('Connected to Redis');
      });

      this.client.on('error', (err) => {
        console.error('Redis error', err);
      });

      RedisClient.instance = this;
    }

    return RedisClient.instance;
  }

  getClient() {
    return this.client;
  }
}

const instance = new RedisClient();
Object.freeze(instance);

module.exports = instance;

3. Use the Redis Singleton in Your Express Application:

// app.js
const express = require('express');
const redisClient = require('./redisClient');

const app = express();
const port = 3000;

app.get('/', async (req, res) => {
  const client = redisClient.getClient();
  await client.set('key', 'value');
  const value = await client.get('key');
  res.send(`Value for 'key' is: ${value}`);
});

app.listen(port, () => {
  console.log(`Server is running on http://localhost:${port}`);
});

Following this strategy ensures that just one Redis client instance is created and reused throughout your application, making it more efficient and reducing the number of needless connections to the Redis server.

Try it <3 Happy coding!!!