Git Product home page Git Product logo

walidbosso / mern_stack_blogproject Goto Github PK

View Code? Open in Web Editor NEW
3.0 1.0 1.0 644 KB

This project is a dynamic and responsive full-stack web application developed using the MERN (MongoDB, Express.js, React.js, Node.js) stack. Tailwind CSS is utilized for modern and utility-driven styling.

Home Page: https://github.com/walidbosso/MERN_Stack_BlogProject

License: MIT License

HTML 6.83% CSS 2.47% JavaScript 90.70%
blog expressjs javascript mongodb nodejs reactjs tailwindcss webapp about article articles components home mern-stack mern-stack-development navbar notfound addcommentform articleslist commentslist

mern_stack_blogproject's Introduction

MERN_Stack_BlogProject

GitHub WidgetBox


MERN Stack Project with Tailwind CSS

Summary

This project is a dynamic and responsive full-stack web application developed using the MERN (MongoDB, Express.js, React.js, Node.js) stack. Tailwind CSS is utilized for modern and utility-driven styling. The project includes various components such as comment forms, article renderers, and navigation bars, along with distinct pages like the About, Article, Articles List, Home, and NotFound. The application aims to provide a seamless and engaging user experience, allowing users to explore and interact with articles and comments. The project is open-source and licensed under the MIT License.

Components

1. AddCommentForm.js

  • Description: This component facilitates the addition of comments to the web application. It integrates seamlessly with the comment feature.

2. Articles.js

  • Description: Responsible for rendering articles on the user interface. This component plays a crucial role in presenting content to users.

3. CommentsList.js

  • Description: Displays a list of comments associated with articles. Enhances user engagement by showcasing community interactions.

4. Navbar.js

  • Description: The navigation bar component that provides easy and intuitive access to different sections of the web application.

Pages

1. About.js

  • Description: The About page offers insights into the purpose and vision of the web application. Users can learn more about the project and its contributors.

2. Article.js

  • Description: This page presents individual articles with detailed content, fostering a rich reading experience for users.

3. Article_before_fullstack-react.js

  • Description: The previous version of the article page, capturing the evolution of the application before the migration to full-stack React.

4. ArticlesList.js

  • Description: Lists multiple articles, providing users with an overview of available content. Enhances content discoverability.

5. Home.js

  • Description: The homepage serves as the entry point for users, featuring highlights and essential information about the application.

6. NotFound.js

  • Description: This page handles 404 errors gracefully, improving the user experience by guiding users when they encounter missing or non-existent pages.

License

This project operates under the MIT License. Refer to the LICENSE file for detailed information.

Feedback and Contributions

Your feedback and contributions are invaluable! Feel free to open issues, submit pull requests, or connect for discussions.



 
© by Walid BOUSSOU  🇲🇦 😄
 


👏 Thanks for the support

Stargazers

Stargazers repo roster for @walidbosso/MERN_Stack_BlogProject

Forkers

Forkers repo roster for @walidbosso/MERN_Stack_BlogProject

Contributors



GitHub last commit (by committer)

GitHub License

𝚂𝚑𝚘𝚠 𝚜𝚘𝚖𝚎 💙 𝚋𝚢 𝚜𝚝𝚊𝚛𝚛𝚒𝚗𝚐 ⭐ 𝚝𝚑𝚎 𝚛𝚎𝚙𝚘𝚜𝚒𝚝𝚘𝚛𝚢!


Back to top

mern_stack_blogproject's People

Contributors

walidbosso avatar tetouanii avatar

Stargazers

Md Monauwarul Islam avatar Imani 'K!ΠG' Niyigena  avatar Alper SARAÇ avatar

Watchers

 avatar

Forkers

ciumabok

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.