招聘MERN全栈开发者

4.0

2025/6/16

zh招聘信息MERN全栈开发招聘ReactNode.js

提示语

✅ Project Overview:
We are looking to hire a dedicated Full Stack MERN Developer to build a complete web application using MongoDB, Express.js, React.js, and Node.js. The project will include both a user-facing frontend and a powerful, dynamic Admin Panel. The application must feature a clean UI/UX design, full responsiveness, complete CRUD operations, and robust backend API integration. Every section must be dynamic and fully connected to the MongoDB database.

🎯 Project Requirements:
🔹 1. Frontend (React.js)
Developed using React.js with reusable components.

Responsive Design: Fully mobile, tablet, and desktop responsive.

UI/UX must be clean, modern, and user-friendly.

Integration with backend APIs using Axios or Fetch.

Separate login/signup system for users and admin.

Dynamic content rendering using props/state and API data.

🔹 2. Backend (Node.js & Express.js)
RESTful API development using Node.js and Express.js.

Secure authentication with JWT (JSON Web Token) or session-based auth.

Role-based access (Admin & User).

Input validation and proper error handling.

Middleware for logging, security, and data processing.

🔹 3. Database (MongoDB)
Use of MongoDB Atlas or local MongoDB.

All data (users, items, products, content, etc.) must be stored in MongoDB.

Proper schema design with Mongoose.

All CRUD operations must reflect in the database dynamically.

🔹 4. Admin Panel
A fully functional and dynamic Admin Dashboard built with React.

Features to:

View, add, edit, delete all dynamic entities (products, users, orders, etc.).

Dashboard with statistics and analytics (can be dummy for now).

User management (ban, delete, assign roles).

Content management for front-end visibility.

All data connected with MongoDB through APIs.

Access restricted to admin users only.

📱 Responsiveness & Design
All pages must be 100% responsive (Mobile, Tablet, Desktop).

Use of CSS Framework like Tailwind CSS, Bootstrap, or Material-UI is preferred.

Smooth transitions, interactive components, and clean layouts.

🔁 CRUD Operations
All dynamic sections must support Create, Read, Update, Delete (CRUD).

Reflect changes instantly across frontend and backend.

Proper toast/message notifications for actions.

Each CRUD action must be linked directly to the MongoDB database.

📡 API Integration
All frontend components must communicate with backend using RESTful APIs.

All API endpoints should be:

Properly tested.

Well-structured and scalable.

Secured with authentication and authorization where needed.

🛡️ Security & Deployment
Backend secured using proper authentication middleware.

Prevent SQL injection, XSS, CSRF, and other vulnerabilities.

Ready for deployment on platforms like Vercel, Netlify (frontend) and Render, Heroku, or DigitalOcean (backend).

💼 Dedicated Developer Expectations
Must have experience in building MERN applications.

Deliver high-quality, maintainable, and scalable code.

Ability to communicate clearly and meet project deadlines.

Familiarity with Git/GitHub for version control.

Ready to work full-time or dedicated for this project duration.

📋 Optional Features (Nice to Have):
Pagination and search filters.

File/image upload feature (e.g., profile pictures).

Notification system (email or in-app).

Light/Dark mode toggle.

Multilingual support.

📦 Final Deliverables:
Fully functional frontend and backend codebase.

Responsive and dynamic Admin Panel.

Complete API documentation.

Live demo or deployed version of the project.

Source code with instructions for setup and deployment.

生成结果

import React from 'react';
import './App.css';

function App() {
  return (
    <div className="App">
      <header className="bg-blue-600 text-white p-4">
        <h1 className="text-3xl font-bold">MERN Stack Application</h1>
      </header>
      <main className="p-4">
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">Frontend with React.js</h2>
          <p className="text-gray-600 mt-2">Developed using React.js with reusable components.</p>
        </section>
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">Backend with Node.js & Express.js</h2>
          <p className="text-gray-600 mt-2">RESTful API development using Node.js and Express.js.</p>
        </section>
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">Database with MongoDB</h2>
          <p className="text-gray-600 mt-2">Use of MongoDB Atlas or local MongoDB.</p>
        </section>
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">Admin Panel</h2>
          <p className="text-gray-600 mt-2">A fully functional and dynamic Admin Dashboard built with React.</p>
        </section>
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">Responsiveness & Design</h2>
          <p className="text-gray-600 mt-2">All pages must be 100% responsive.</p>
        </section>
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">CRUD Operations</h2>
          <p className="text-gray-600 mt-2">All dynamic sections must support Create, Read, Update, Delete (CRUD).</p>
        </section>
        <section className="mb-8">
          <h2 className="text-2xl font-semibold text-gray-800">API Integration</h2>
          <p className="text-gray-600 mt-2">All frontend components must communicate with backend using RESTful APIs.</p>
        </section>
        <footer className="bg-gray-800 text-white p-4 mt-8">
          <p>© 2025 MERN Stack Application. All rights reserved.</p>
        </footer>
      </main>
    </div>
  );
}

export default App;

Open Sandbox