Microsoft-LSA-Nexus-Chapter / Nexus-Chapter-Website

This Repo Contains our MLSA Nexus Chapter Website, Feel Free to Contribute
https://mlsa-nexus-chapter.netlify.app/
6 stars 16 forks source link
hacktober2024 hacktoberfest

MLSA Nexus Chapter Website

Welcome to the MLSA Nexus Chapter Website repository! πŸŽ‰
This project is built using Next.js with TypeScript for type safety and Tailwind CSS for styling. It’s designed to be a dynamic, community-driven platform where Microsoft Learn Student Ambassadors (MLSA) can share resources, announce events, and foster collaboration.

Figma Link for reference

https://www.figma.com/design/9EePKTLQQBEbIW1FtQKXJJ/Nexus-Website


πŸš€ Tech Stack


πŸŽƒ Hacktoberfest 2024 Collaboration

We are thrilled to announce that MLSA Nexus Chapter Website is part of Hacktoberfest 2024! Hacktoberfest is a month-long celebration of open-source software, and we welcome all contributors, from beginners to seasoned developers, to join us and help make this repository even better.

Rules for Contriution:-

πŸ› οΈ Installation and Setup

Prerequisites

Before you start, make sure you have the following installed:

Clone the Repository

git clone https://github.com/Microsoft-LSA-Nexus-Chapter/Nexus-Chapter-Website
cd Nexus-Chapter-Website

Install Dependencies

 npm install

Running the Development Server

 npm run dev

It will open at https:/localhost/3000

Project Structure

|src/
    β”œβ”€β”€ app/                # App Router, entry point for Next.js routes
       β”œβ”€β”€ layout.tsx      # Layout component for all pages
       β”œβ”€β”€ page.tsx        # Home page component
       β”œβ”€β”€ events/page.tsx  # Events section with nestedroutes
       |___ gallery/page.tsx  # Gallery of all the events
       |___ members/page.tsx  # Members of the MLSA Nexus chapter
       └── about/page.tsx         # About section with static content
       |___ Contact/page.tsx  # Contact Page
    β”œβ”€β”€ components/         # Reusable components (Header, Footer, etc.)
β”œβ”€β”€ public/             # Static files like images and icons
    β”œβ”€β”€ images/
β”œβ”€β”€ styles/             # Global styles and Tailwind configuration
β”œβ”€β”€ tsconfig.json       # TypeScript configuration
└── tailwind.config.js  # Tailwind CSS configuration

App Router

The App Router (app/) is where all of the routing happens. Instead of a traditional pages/ directory, each folder inside app/ acts as a route. You can also nest routes easily within this structure.

πŸ“’ Important Note

All contributions must adhere to the Hacktoberfest Rules to be counted as valid contributions. This includes ensuring meaningful pull requests and avoiding spammy or incomplete submissions.

πŸ“š Resources

If you're new to open-source or want to learn more about contributing, here are some helpful links:

How to Contribute to open Source

GitHub Documentation

Hacktoberfest Participation Guide

If you're new to Next.js, TypeScript, or Tailwind CSS, check out these resources:

Next.js Documentation

TypeScript Documentation

Tailwind CSS Documentation