Skip to content

Latest commit

 

History

History
294 lines (240 loc) · 11.4 KB

README.md

File metadata and controls

294 lines (240 loc) · 11.4 KB

MyMind | Portal 🚀

Welcome to MyMind | Portal 🎨, your one-stop solution for dynamically managing and updating the Bio, Skills, Experience, Projects, and Education sections of your personal portfolio. Designed with simplicity and efficiency in mind, this portal lets you keep your portfolio content fresh and up to date.

🔗 Access the portal here: MyMind | Portal

🌐 Check out the live portfolio: MyMind | Portfolio

Key Features

1. Google Authentication 🔒

  • Secure login via Google Authentication.
  • The login page includes:
    • Heading: MyMind | Portal
    • Inputs: Email and Password (with a show/hide toggle 👁️)
    • Login Button to proceed to the portal.

Desktop View:

MyMind Portal Login Page
MyMind Portal Login Page

Mobile View:

MyMind Portal Login Page Mobile MyMind Portal Login Page Mobile MyMind Portal Login Page Mobile

2. Customizable Pages 🛠️

Upon logging in, you are greeted with a Welcome Message 🎉 and given options to manage the following pages:

Bio 📝

  • Edit and save your:

    • Name ✍️
    • Description 🗒️
    • Roles 💼
    • Profile Picture 📸
    • GitHub URL 🔗
    • LinkedIn URL 🔗
    • Instagram URL 📷
    • Resume (with upload functionality 📄)
  • Delete all bio data with the Delete Button 🗑️.

    Desktop View:

MyMind Portal Bio Page
MyMind Portal Bio Page

Mobile View:

MyMind Portal Bio Page Mobile MyMind Portal Bio Page Mobile MyMind Portal Bio Page Mobile

Skills 🛠️

  • Add, edit, or delete skills.

  • Inputs include:

    • Skill Name 💡
    • Skill Type (Frontend, Backend, AI/ML, Others) 🖥️
    • Upload Skill Image 🖼️

    Desktop View:

MyMind Portal Skills Page
MyMind Portal Skills Page

Mobile View:

MyMind Portal Skills Page Mobile MyMind Portal Skills Page Mobile MyMind Portal Skills Page Mobile

Experience 💼

  • Add, edit, or delete experiences.

  • Experience is displayed as cards 🃏 with Edit and Delete options.

  • Input fields include:

    • Company Name 🏢
    • Date 📅
    • Role 👔
    • Description 📝
    • Company Link 🔗
    • Skills Gained 💡
    • Company Logo 🏙️

    Desktop View:

MyMind Portal Experience Page
MyMind Portal Experience Page

Mobile View:

MyMind Portal Experience Page Mobile MyMind Portal Experience Page Mobile MyMind Portal Experience Page Mobile

Projects 💻

  • Manage projects with options to add, edit, or delete.
  • Projects are displayed as cards 🃏 with:
    • Title 🏷️

    • Category (Web, Deep Learning, Machine Learning, etc.) 📂

    • Date 📅

    • Description 📝

    • GitHub URL 🔗

    • Web App URL 🌐

    • Tags 🏷️

    • Project Image 🖼️

    • Team Members 👥 (add/delete team members with inputs for their name, GitHub URL, LinkedIn URL, profile picture)

    • Checkbox to "Show Project on Home Page" 🏠 of the portfolio.

      Desktop View:

MyMind Portal Projects Page
MyMind Portal Projects Page

Mobile View:

MyMind Portal Projects Page Mobile MyMind Portal Projects Page Mobile MyMind Portal Projects Page Mobile

Education 🎓

  • Manage education with options to add, edit, or delete.

  • Displayed as cards 🃏 with edit and delete features.

  • Input fields include:

    • School/College Name 🏫
    • Degree 🎓
    • Date 📅
    • Grade 📊
    • Description 📝
    • School/College Logo 🏫

    Desktop View:

MyMind Portal Education Page
MyMind Portal Education Page

Mobile View:

MyMind Portal Education Page Mobile MyMind Portal Education Page Mobile MyMind Portal Education Page Mobile

3. Portal Page 🏠

After login, navigate the portal using:

  • Five Buttons 🔘 leading to the respective pages (Bio, Skills, Experience, Projects, Education)

  • Logout Button 🚪 to securely log out.

    Desktop View:

MyMind Portal Portal Page
MyMind Portal Portal Page

Mobile View:

MyMind Portal Portal Page Mobile MyMind Portal Portal Page Mobile

4. Reusable Components 🔁

  • Header 🔝: Includes navigation back to the portal.
  • Footer 🔻: Includes the MyMind | Portfolio logo, your name, and social icons for GitHub, LinkedIn, and Instagram, along with a copyright message.

5. Modals and Loaders

  • Confirmation modals 🛑 to prevent accidental deletions.

  • Loaders ⏳ for a smooth user experience during data and image uploads.

    Mobile View:

MyMind Portal Modals MyMind Portal Modals MyMind Portal Modals MyMind Portal Loaders

6. Responsive Design 📱💻

  • The entire portal is optimized for both desktop and mobile use, providing a seamless experience across devices.

7. PWA Support 📲

  • The portal can be installed as a web app with a custom icon via the manifest.json.
  • Includes meta tags, Open Graph (OG) tags, and Twitter tags 🐦 for SEO optimization and social media integration.

Tech Stack 🛠️

  • Frontend: React.js, Tailwind CSS 🎨
  • Hosting: GitHub Pages 🖥️
  • Backend: Firebase (Realtime Database for data, Storage for images, and Authentication for login) 🔥
  • Authentication: Google Sign-In 🔒

Collaboration 🤝

We are open to contributions! If you're interested in collaborating or enhancing this project, feel free to fork this repository 🍴 and submit a pull request 🔄. Let's build something great together!