Skip to content

ankit485803/ChatCoder-s-Haven_IITP

Repository files navigation

ChatCoder's Haven

A Feature-Rich, Multilingual Compiler With Integrated Chatbot

Group 78: Capstone Project at I.I.T Patna

About Me

I am a Computer Science and Data Analytics student at IIT Patna. Passionate about web development, I constantly strive to create complex and innovative solutions. As a full-stack web developer, I love learning and exploring new technologies.

Connect with Me

Find me on Linktree to explore all my social profiles handles and other platforms!

Linktree

Getting Started

First, run the application in the development server (mode):

node app.js
# or
npm run ChatCoder

Open http://localhost:3030 with your browser to see the result.

You can start editing the page by modifying Backend/app.js. The page auto-updates as you edit the file.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Node.js GitHub repository - your feedback and contributions are welcome!

Project Overview

"CHATCODER’S HAVEN” aims to develop a feature-rich web application for online coding, providing users with a multilingual compiler supporting Python, Java, and C++. The platform offers an intuitive coding environment with syntax highlighting tailored to each programming language, along with auto-closing brackets for tags and line numbering displayed on the left side of each line. Users can also enjoy a dark theme option for enhanced visibility and reduced eye strain.

An integrated Chatbot enhances user experience by providing real-time support. Leveraging the MERN stack, the project prioritizes flexibility and scalability for future expansion and integration of new features. While the current iteration offers Python, Java, and C++ programming languages, the project envisions future expansion to incorporate additional languages and functionalities akin to Visual Studio Code (VS Code in Online).

By providing a user-friendly interface, syntax highlighting tailored to each language, and real-time collaboration, we empower coders worldwide. Our project bridges the gap between coding proficiency and accessibility, fostering a vibrant community of learners and creators.

This project is developed and maintained by Group 78 members of Capstone Project 108 at I.I.T Patna.

Project Repository

Explore the project repository: https://github.com/ankit485803/ChatCoder-s-Haven_IITP

Tech Stack

  • MERN Stack:
    • MongoDB
    • Express.js
    • React
    • Node.js
    • Vanilla HTML, CSS, & JavaScript
  • Python Programming Language

Key Features (in short):

  • Multilingual Support: Code in various programming languages currently Python, Java, C++ and JavaScript (under testing)
  • Real-time Code Compilation and Execution: Code, compile, and run code snippets within the platform
  • Integrated Chatbot: Developed a chatbot to assist users with coding tasks on the platform
  • QR Code Sign-in (Upcoming Feature): Implementing a sign-in feature using QR codes, allowing users to directly login to our portal by scanning and connecting
  • Syntax Highlighting: Code editor with syntax highlighting tailored to each supported language
  • Auto-closing Brackets and Line Numbering: Enhanced code readability with automatic bracket closing and line numbering
  • Dark Theme Option: Improve user experience with a dark theme option for reduced eye strain
  • Interactive Quizzes: This feature is under the Challenge Section; a quiz format & provides an interactive learning experience.



ChatCoder's Hello World



Team Members: Roles and Responsibilities

Frontend Development:

  • Aditya Kumar: Responsible for creating the Home and Login page.

    • create the Home page using HTML, CSS, JavaScript.
    • ensuring a “user-friendly and welcoming first impression" through the home page.
    • the Login page interface is designed by Aditya & seamless authentication is managed by Ashish.
  • Anupama Jagriti: In charge of the “About Us” page and Challenge - Section

    • create the narrative for the 'About Us' page using HTML and CSS.
    • develop an engaging Challenge section that enhances our coding experience.
    • to provide Interactive Quizzes (like quiz format) features in the Challenges Section designed using vanilla HTML, CSS, and JavaScript, providing an interactive learning experience.
  • Pranchal Gupta: Managing the “Contact Us” page and Handling User’s Feedback

    • architect user engagement through the 'Contact Us' page, utilizing HTML, CSS, and JavaScript to establish a clear and functional communication channel.
    • built the bridge between users and the team by crafting a user-friendly 'Contact Us' through this page and form fields bridge continents, inviting messages from distant lands.
    • manages user feedback, facilitating meaningful interactions between users and the team.

Backend & DB:

  • Ankit Kumar: plays crucial and pivotal roles (Compilation, Repo maintenance & Multilingual feature), are:

    • developing the web application, which serves as an online coding platform with multilingual features.
    • compile the programming languages; currently Python, Java, C++ and JavaScript (under testing).
    • ensures that the coding environment supports syntax highlighting tailored to each programming language.
    • implements auto-closing brackets for tags and displays line numbering on the left side of each new line.
    • provides dark theme option for better visibility and reduced eye strain
    • handles real-time CRUD operations (Create, Read, Update, Delete).
    • contributes to Testing and Debugging part of the code, ensuring a robust application, checking and reviewing the code of each member before pulling (PR) to GitHub.
    • integrates the chatbot into our application but created and developed by Ashish.
    • reviewed and corrected code errors with the support of all members.
    • merged pull requests, reviewed code, and maintained the GitHub repository.
  • Ashish Kumar: Visionary Developer Spearheading Chatbot and Authentication

    • developing a ChatCoder_Bot that will provide real-time coding assistance directly within the platform.
    • streamlining user access by implementing a secure and convenient QR code sign-in feature (Upcoming Feature)
    • designed the Login page (by Aditya), and authentication for the Login Page dashboard, including sign-in and sign-up functionalities using HTML, CSS, JavaScript, and Node.js by Ashish.
    • develop Chabot using custom data utilization to offer tailored coding help, enhancing the support experience for users.

Connect with me:

GitHub LinkedIn LeetCode Twitter YouTube