This project is a dynamic website built for a fictional digital marketing company. It showcases the skills of a Full Stack MERN Developer by implementing various features and technologies, including MongoDB, Express.js, React.js, and Node.js.
- Objective
- Requirements
- Additional Considerations
- Submission Guidelines
- Live Website
- Evaluation Criteria
- Installation
- Usage
- Contributing
- License
The goal of this project is to create a modern, visually appealing, and user-friendly dynamic website for a digital marketing company using the MERN stack.
-
Landing Page:
- Engaging landing page with a clear call-to-action.
- Smooth animations or transitions for an enhanced user experience.
- Sections introducing the company's core values and services.
-
About Us Page:
- Information about the company, its mission, and team members.
- Clean and minimalistic design for improved readability.
-
Blog Page:
- Multiple blog posts with featured images, titles, brief descriptions, and a "Read More" link.
- Detailed page with the full content when a blog post is clicked.
-
Services Page:
- Showcase cards for various services with detailed information for each service.
- Effective design to highlight key features of each service.
-
Contact Us Form:
- Design a contact form with fields for name, email, phone, and message.
- Information submission to a designated email address.
- Implement client-side and server-side form validation.
-
Performance Optimization:
- Optimized for fast loading speed.
- Lazy loading for images and optimization of other assets.
-
Responsive Design:
- Fully responsive for various devices and screen sizes.
-
Database Integration:
- MongoDB for storing and retrieving data dynamically.
- CRUD operations for blog posts and services.
-
Security:
- Implementation of necessary security measures to prevent common web vulnerabilities.
- Submit the assignment as a GitHub repository containing both frontend (React.js) and backend (Node.js, Express.js, MongoDB) code.
- Include a README file with clear instructions on how to run the application locally.
- Provide additional information or explanations regarding design choices or features in the README.
- Deploy the website using any free hosting service (e.g., Heroku, Netlify).
- Share the live link in the README for the team to review the website's functionality and appearance in a real-world environment.
- Technical Skills: Effective use of the MERN stack, dynamic feature implementation, and MongoDB integration.
- Design and UI/UX: Creation of a visually appealing, user-friendly, and minimalistic interface.
- Performance Optimization: Implementation of optimizations for fast loading speed.
- Code Quality: Clean, well-structured, and maintainable code.
- Deployment: Successful deployment of the website on a hosting service with a provided live link.
- Clone the repository to your local machine.
- Navigate to the project directory.
npm install
- Start the frontend and backend servers.
npm start
Visit http://localhost:3000 in your browser.
Feel free to contribute to the project by opening issues or submitting pull requests.
This project is licensed under the MIT License.