Sure thing! Here's a full-stack CRUD example—NestJS backend and React frontend using Axios—built around your original Express + Mongoose server.js setup. I’ve also included tips from real tutorials to make it smooth. Feel free to customize the data model to suit your needs (users, tasks, products, etc.).

Backend: NestJS with Mongoose
1. Initialize and Set Up NestJS Project
npm i -g @nestjs/cli
nest new nest-backend
cd nest-backend
npm install @nestjs/mongoose mongoose


In src/main.ts, enable CORS:

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.enableCors();
  await app.listen(3000);
}
bootstrap();


Restack

2. Connect to MongoDB

In src/app.module.ts:

import { Module } from '@nestjs/common';
import { MongooseModule } from '@nestjs/mongoose';
import { ItemModule } from './item/item.module';

@Module({
  imports: [
    MongooseModule.forRoot('mongodb://localhost:27017/mydb'),
    ItemModule,
  ],
})
export class AppModule {}

3. Create Item Module, Schema, Service & Controller

Run: nest generate module item, nest generate service item, nest generate controller item.

item.schema.ts:
import { Schema, Document } from 'mongoose';
export type ItemDocument = Item & Document;

export class Item {
  name: string;
  description: string;
  createdAt: Date;
}

export const ItemSchema = new Schema<Item>({
  name: { type: String, required: true },
  description: String,
  createdAt: { type: Date, default: Date.now },
});

item.module.ts:
import { Module } from '@nestjs/common';
import { MongooseModule } from '@nestjs/mongoose';
import { Item, ItemSchema } from './item.schema';
import { ItemService } from './item.service';
import { ItemController } from './item.controller';

@Module({
  imports: [
    MongooseModule.forFeature([{ name: Item.name, schema: ItemSchema }]),
  ],
  providers: [ItemService],
  controllers: [ItemController],
})
export class ItemModule {}

item.service.ts:
import { Injectable, NotFoundException } from '@nestjs/common';
import { InjectModel } from '@nestjs/mongoose';
import { Model } from 'mongoose';
import { Item, ItemDocument } from './item.schema';

@Injectable()
export class ItemService {
  constructor(@InjectModel(Item.name) private itemModel: Model<ItemDocument>) {}

  async create(data: Partial<Item>): Promise<Item> {
    const created = new this.itemModel(data);
    return created.save();
  }

  async findAll(): Promise<Item[]> {
    return this.itemModel.find().exec();
  }

  async findOne(id: string): Promise<Item> {
    const item = await this.itemModel.findById(id).exec();
    if (!item) throw new NotFoundException('Item not found');
    return item;
  }

  async update(id: string, data: Partial<Item>): Promise<Item> {
    const updated = await this.itemModel.findByIdAndUpdate(id, data, { new: true }).exec();
    if (!updated) throw new NotFoundException('Item not found');
    return updated;
  }

  async remove(id: string): Promise<void> {
    const result = await this.itemModel.findByIdAndDelete(id).exec();
    if (!result) throw new NotFoundException('Item not found');
  }
}

item.controller.ts:
import { Controller, Get, Post, Body, Param, Put, Delete } from '@nestjs/common';
import { ItemService } from './item.service';
import { Item } from './item.schema';

@Controller('items')
export class ItemController {
  constructor(private readonly itemService: ItemService) {}

  @Post() create(@Body() dto: Partial<Item>) {
    return this.itemService.create(dto);
  }

  @Get() findAll() {
    return this.itemService.findAll();
  }

  @Get(':id') findOne(@Param('id') id: string) {
    return this.itemService.findOne(id);
  }

  @Put(':id') update(@Param('id') id: string, @Body() dto: Partial<Item>) {
    return this.itemService.update(id, dto);
  }

  @Delete(':id') remove(@Param('id') id: string) {
    return this.itemService.remove(id);
  }
}


This gives you a working CRUD RESTful API using NestJS and Mongoose. You can refer to similar patterns at Restackio for NestJS + Mongoose CRUD examples 
Restack
.

Frontend: React + Axios
1. Create React App + Axios
npx create-react-app frontend
cd frontend
npm install axios

2. API Service (src/services/itemService.js):
import axios from 'axios';

const API = 'http://localhost:3000/items';

export const getItems = async () => {
  try {
    const res = await axios.get(API);
    return res.data;
  } catch (error) {
    console.error('Failed to fetch items:', error);
    throw error;
  }
};

export const createItem = async (item) => {
  try {
    const res = await axios.post(API, item);
    return res.data;
  } catch (error) {
    console.error('Failed to create item:', error);
    throw error;
  }
};

export const getItem = async (id) => {
  try {
    const res = await axios.get(`${API}/${id}`);
    return res.data;
  } catch (error) {
    console.error('Failed to get item:', error);
    throw error;
  }
};

export const updateItem = async (id, item) => {
  try {
    const res = await axios.put(`${API}/${id}`, item);
    return res.data;
  } catch (error) {
    console.error('Failed to update item:', error);
    throw error;
  }
};

export const deleteItem = async (id) => {
  try {
    await axios.delete(`${API}/${id}`);
  } catch (error) {
    console.error('Failed to delete item:', error);
    throw error;
  }
};


3. Components
ItemForm.jsx — for create/update:
import React, { useState, useEffect } from 'react';
import { createItem, updateItem, getItem } from '../services/itemService';

const ItemForm = ({ id, onSuccess }) => {
  const [name, setName] = useState('');
  const [description, setDescription] = useState('');
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    if (id) {
      setLoading(true);
      getItem(id)
        .then(data => {
          setName(data.name);
          setDescription(data.description || '');
        })
        .catch(() => alert('Failed to load item'))
        .finally(() => setLoading(false));
    } else {
      setName('');
      setDescription('');
    }
  }, [id]);

  const handleSubmit = async (e) => {
    e.preventDefault();
    if (!name.trim()) {
      alert('Name is required');
      return;
    }

    setLoading(true);
    try {
      if (id) {
        await updateItem(id, { name, description });
      } else {
        await createItem({ name, description });
      }
      onSuccess();
      setName('');
      setDescription('');
    } catch {
      alert('Failed to save item');
    } finally {
      setLoading(false);
    }
  };

  return (
    <form onSubmit={handleSubmit} style={{ marginBottom: 20 }}>
      <input
        type="text"
        placeholder="Name"
        value={name}
        onChange={e => setName(e.target.value)}
        disabled={loading}
        required
        style={{ marginRight: 10, padding: 8 }}
      />
      <textarea
        placeholder="Description"
        value={description}
        onChange={e => setDescription(e.target.value)}
        disabled={loading}
        style={{ marginRight: 10, padding: 8, verticalAlign: 'top' }}
      />
      <button type="submit" disabled={loading}>
        {id ? 'Update' : 'Create'}
      </button>
    </form>
  );
};

export default ItemForm;


ItemList.jsx — list and delete:
import React, { useState, useEffect } from 'react';
import { getItems, deleteItem } from '../services/itemService';

const ItemList = ({ onEdit }) => {
  const [items, setItems] = useState([]);
  const [loading, setLoading] = useState(false);

  const loadItems = () => {
    setLoading(true);
    getItems()
      .then(setItems)
      .catch(() => alert('Failed to load items'))
      .finally(() => setLoading(false));
  };

  useEffect(() => {
    loadItems();
  }, []);

  const handleDelete = async (id) => {
    if (!window.confirm('Delete this item?')) return;
    try {
      await deleteItem(id);
      loadItems();
    } catch {
      alert('Failed to delete item');
    }
  };

  if (loading) return <p>Loading items...</p>;
  if (!items.length) return <p>No items found.</p>;

  return (
    <ul>
      {items.map(({ _id, name, description }) => (
        <li key={_id} style={{ marginBottom: 10 }}>
          <strong>{name}</strong>: {description || 'No description'}
          <button onClick={() => onEdit(_id)} style={{ marginLeft: 10 }}>
            Edit
          </button>
          <button onClick={() => handleDelete(_id)} style={{ marginLeft: 5 }}>
            Delete
          </button>
        </li>
      ))}
    </ul>
  );
};

export default ItemList;


src/components/ErrorBoundary.jsx:-


import React from 'react';

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = { hasError: false, error: null };
  }

  static getDerivedStateFromError(error) {
    return { hasError: true, error };
  }

  componentDidCatch(error, errorInfo) {
    console.error('ErrorBoundary caught:', error, errorInfo);
  }

  render() {
    if (this.state.hasError) {
      return (
        <div style={{ color: 'red' }}>
          <h2>Something went wrong.</h2>
          <pre>{this.state.error?.message}</pre>
        </div>
      );
    }

    return this.props.children;
  }
}

export default ErrorBoundary;


4. App.jsx: Combine both
import React, { useState } from 'react';
import ItemForm from './components/ItemForm';
import ItemList from './components/ItemList';
import ErrorBoundary from './components/ErrorBoundary';

const App = () => {
  const [editingId, setEditingId] = useState(null);

  const onSuccess = () => setEditingId(null);

  return (
  <>
  <h1> hello world</h1>
    <div style={{ maxWidth: 600, margin: '40px auto', fontFamily: 'Arial, sans-serif' }}>
      <h1>Item CRUD</h1>
      <ItemForm id={editingId} onSuccess={onSuccess} />
      <ErrorBoundary>
        <ItemList onEdit={setEditingId} />
      </ErrorBoundary>
    </div>
	</>
  );
};

export default App;





Summary
Part	Description
Backend	NestJS with Mongoose: full CRUD REST API
Frontend	React + Axios: create, list, update, delete UI
Tutorial Insights	Mirrors patterns from Restackio and Medium on integrating NestJS + React



note:- if error will come of destory fucntion then just change your index.js file:-


import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <App />
);