My WeCoded Landing Page
A dynamic and engaging landing page for the annual WeCoded celebration, showcasing diversity and innovation in tech. Built with React, TypeScript, and Tailwind CSS.
🚀 Features
- Dynamic Content: Real-time integration with DEV.to API to showcase WeCoded stories
- Modern Design: Beautiful, responsive interface with smooth animations
- Interactive Timeline: Visual journey through WeCoded's history
- Impact Metrics: Live statistics showcasing community growth
- Story Submission: Direct integration with DEV.to for new submissions
Demo
https://we-coded-2025-landing-page.vercel.app/
GitHub repo
https://github.com/adhavshruti12/WeCoded-2025-Landing-Page.git
How I Built It
Colors
- Primary Blue:
#4531EA - Accent Green:
#CCEA71 - Secondary Purple:
#9D00E5
Typography
- Modern, clean typography using Tailwind's font system
- Responsive text sizing for all devices
Components
- Interactive cards with hover effects
- Glassmorphic UI elements
- Responsive grid layouts
- Animated transitions
📱 Responsive Design
- Mobile-first approach
- Breakpoints:
- Mobile: < 768px
- Tablet: 768px - 1024px
- Desktop: > 1024px
🔄 API Integration
The landing page integrates with the DEV.to API to fetch WeCoded stories:
fetch('https://dev.to/api/articles?tag=wecoded')
.then(response => response.json())
.then(data => {
// Process articles
});
