CSEC ASTU Website

A modern website for the Computer Science and Engineering Club at Adama Science and Technology University.

What This Is

This is the official website for CSEC ASTU built as part of the Full Stack Web Development internship project. The goal was to create a real, functional website for an actual organization to help them attract members and look professional online.

Features

• Landing page with typewriter animation effect
• Sections for each club division - Competitive Programming, Development, Data Science, Cybersecurity, Community Outreach
• Events page showing upcoming and past activities
• Member testimonials so visitors can see what current members think
• Embedded Google Maps with location info
• FAQ section answering common questions
• Fully responsive - works on phones, tablets, and desktop
• Dark theme with smooth animations

Tech Stack

• React 18.3
• Vite (build tool)
• Tailwind CSS
• Framer Motion (animations)
• Lucide React (icons)
• Google Maps API

Getting Started

Setup

git clone https://github.com/estif0/FUTURE_FS_03.git
cd FUTURE_FS_03
npm install

Running locally

npm run dev

Open http://localhost:5173 in your browser.

Building for production

npm run build

The built files go in the dist/ folder.

Linting

npm run lint

Project Structure

src/
├── components/
│   ├── Hero/              # Homepage hero section
│   ├── Divisions/         # Club divisions showcase
│   ├── Events/            # Events section
│   ├── Testimonials/      # Member testimonials
│   ├── FAQ/               # Common questions
│   ├── Footer/            # Footer with links
│   ├── Navigation.jsx     # Navigation bar
│   ├── Map.jsx            # Location and contact info
│   └── ...other components
├── App.jsx                # Main app component
└── main.jsx               # Entry point

Performance

• Builds in ~11 seconds
• Bundle size: 300KB (96KB gzipped)
• Fully responsive and mobile-optimized
• Fast load times using Vite

How to Deploy

Vercel (easiest)

npm install -g vercel
vercel

Netlify

npm install -g netlify-cli
netlify deploy

GitHub Pages

Build the project and deploy the dist/ folder to GitHub Pages.

Future Ideas

Want to add more features? Some ideas:

• Blog section
• Event registration
• Member login portal
• Newsletter signup
• Photos from past events

Contributing

Feel free to fork and contribute. Just:

1. Create a new branch for your feature
2. Make your changes
3. Submit a pull request

License

MIT License - see LICENSE file for details.

Questions?

Email: contact@csec.astu.edu