Skip to content

Commit 9abcff6

Browse files
TheSuranaverseTheSuranaverse
committed
Web3JH official website code push
0 parents  commit 9abcff6

260 files changed

Lines changed: 14623 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.eslintrc.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎.gitignore‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
27+
# local env files
28+
.env
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# typescript
35+
*.tsbuildinfo
36+
next-env.d.ts

‎app/about/page.tsx‎

Lines changed: 308 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,308 @@
1+
'use client';
2+
3+
import { CheckCircle, Target, Eye, Users, Globe, Award, Heart } from 'lucide-react';
4+
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
5+
import { Badge } from '@/components/ui/badge';
6+
import Navigation from '@/components/Navigation';
7+
import { FaLinkedin, FaTwitter } from 'react-icons/fa';
8+
9+
export default function About() {
10+
const values = [
11+
{
12+
icon: Users,
13+
title: 'Community First',
14+
description: 'We believe in the power of collective learning and collaboration to drive innovation.'
15+
},
16+
{
17+
icon: Globe,
18+
title: 'Global Perspective',
19+
description: 'Connecting local talent with global opportunities in the Web3 ecosystem.'
20+
},
21+
{
22+
icon: Award,
23+
title: 'Excellence',
24+
description: 'Committed to delivering high-quality education and building world-class solutions.'
25+
},
26+
{
27+
icon: Heart,
28+
title: 'Inclusivity',
29+
description: 'Creating an environment where everyone can learn, grow, and contribute regardless of background.'
30+
}
31+
];
32+
33+
const team = [
34+
{
35+
name: 'Subham Surana',
36+
role: 'Founder & President',
37+
image: '/Subham_Surana_profile.jpg',
38+
linkedin: 'https://www.linkedin.com/in/subham-surana/',
39+
twitter: 'https://twitter.com/TheSuranaverse',
40+
},
41+
{
42+
name: 'Abhishek Sagar',
43+
role: 'Vice President',
44+
image: '/abhishek_sagar_profile.jpeg',
45+
linkedin: 'https://www.linkedin.com/in/asssagar/',
46+
twitter: 'https://twitter.com/neustarZura',
47+
},
48+
{
49+
name: 'Amarjeet Singh',
50+
role: 'Community Head',
51+
image: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=300&h=300&fit=crop&crop=face',
52+
linkedin: 'https://www.linkedin.com/in/amarjeet-singh/',
53+
twitter: 'https://twitter.com/amarjeet',
54+
},
55+
{
56+
name: 'Mayukh Pankaj',
57+
role: 'Blockchain & AI Head',
58+
image: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=300&h=300&fit=crop&crop=face',
59+
linkedin: 'https://www.linkedin.com/in/mayukhpankaj/',
60+
twitter: 'https://twitter.com/mayukhp',
61+
},
62+
{
63+
name: 'Jatin Gupta',
64+
role: 'Community Manager',
65+
image: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=300&h=300&fit=crop&crop=face',
66+
linkedin: 'https://www.linkedin.com/in/jatingupta/',
67+
twitter: 'https://twitter.com/jatingupta_',
68+
},
69+
{
70+
name: 'Nitin Nandan',
71+
role: 'Design Head',
72+
image: '/Nitin_Nandan_profile.png',
73+
linkedin: 'https://www.linkedin.com/in/ni8innn/',
74+
twitter: 'https://twitter.com/ni8innn',
75+
},
76+
{
77+
name: 'Abhishek Sinha',
78+
role: 'Outreach Partner',
79+
image: '/Abhishek_Sinha_profile.png',
80+
linkedin: 'https://www.linkedin.com/in/abhishek-sinha-b7a7375a/',
81+
twitter: 'https://twitter.com/akseptional',
82+
},
83+
];
84+
85+
const milestones = [
86+
{ year: '2022', event: 'Web3JH Founded', description: 'Started with 10 passionate students from BIT Mesra' },
87+
{ year: '2023', event: 'First Major Event', description: 'Hosted 200+ participants in our inaugural Web3 Meetup' },
88+
{ year: '2023', event: 'Hackathon Success', description: 'Organized Jharkhand\'s first hackathon in Blockchain with 1,000+ participants' },
89+
{ year: '2024', event: 'College Expansion', description: 'Established chapters in 5 major colleges across Jharkhand' },
90+
{ year: '2024', event: 'Industry Partnerships', description: 'Partnered with leading Web3 companies for workshops and meetups' },
91+
{ year: '2025', event: 'Global Recognition', description: 'Recognized as one of India\'s top Web3 communities' }
92+
];
93+
94+
return (
95+
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-blue-50">
96+
<Navigation />
97+
98+
{/* Hero Section */}
99+
<section className="py-20 lg:py-32">
100+
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
101+
102+
<div className="text-center mb-8 sm:mb-8">
103+
<h1 className="text-4xl md:text-6xl font-bold text-gray-900 mb-8">
104+
About{' '}
105+
<span className="bg-gradient-to-r from-blue-600 to-pink-600 bg-clip-text text-transparent">
106+
Web3JH
107+
</span>
108+
</h1>
109+
<h2>
110+
<p className="text-3xl text-gray-600 mb-4">
111+
Johar {' '}
112+
<span role="img" aria-label="folded-hands" className="text-2xl">🙏</span>
113+
</p>
114+
</h2>
115+
<div className="flex flex-col-reverse sm:flex-col items-center">
116+
<div className="text-center mt-8 mb-8 sm:mb-8">
117+
<p className="text-xl text-gray-600 max-w-4xl mx-auto gap-8 whitespace-pre-line hidden sm:block">
118+
Web3JH is a vibrant community dedicated to fostering the growth and adoption of<br/>
119+
decentralized technologies across Jharkhand. We're on a mission to democratize <br/>
120+
Web3 innovation through education on Blockchain and decentralized protocols, <br/>
121+
Community-driven initiatives like monthly meetups, and hands-on experiences <br/>
122+
with self-custodial Wallets, NFTs, DeFi, DAOs and Crypto.
123+
<br/><br/>
124+
</p>
125+
<p className="text-xl text-gray-600 max-w-3xl mx-auto hidden sm:block">
126+
Together at Web3JH, we are shaping the future of Web3 and empowering <br/>
127+
the next-gen of ₿UIDLers, right from the heart of Jharkhand {' '}
128+
<span role="img" aria-label="pink-heart" className="text-2xl">🩷</span>
129+
</p>
130+
131+
{/* Mobile view without line breaks */}
132+
<p className="text-xl text-gray-600 max-w-4xl mx-auto sm:hidden">
133+
Web3JH is a vibrant community dedicated to fostering the growth and adoption of decentralized technologies across Jharkhand.
134+
</p>
135+
<br/>
136+
<p className="text-xl text-gray-600 max-w-3xl mx-auto sm:hidden">
137+
We're on a mission to democratize Web3 innovation through education on Blockchain, decentralized protocols, and hands-on experiences with self-custodial Wallets, NFTs, DeFi, DAOs and Crypto.
138+
</p>
139+
<br/>
140+
<p className="text-xl text-gray-600 max-w-3xl mx-auto sm:hidden">
141+
Together at Web3JH, we are shaping the future of Web3 and empowering the next-gen of ₿UIDLers, right from the heart of Jharkhand <span role="img" aria-label="pink-heart" className="text-2xl">🩷</span>
142+
</p>
143+
</div>
144+
145+
<div className="flex justify-center">
146+
<img src="Web3 JharkhandHomePage.png"
147+
alt="Web3Jharkhand"
148+
width={800}
149+
height={400}
150+
className="object-contain max-w-full h-auto mt-8 sm:mt-16"/>
151+
</div>
152+
</div>
153+
</div>
154+
</div>
155+
</section>
156+
157+
{/* Mission, Vision, Values */}
158+
<section className="py-20 bg-white">
159+
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
160+
<div className="grid md:grid-cols-3 gap-12 mb-20">
161+
<Card className="text-center p-8">
162+
<Target className="w-12 h-12 text-purple-600 mx-auto mb-6" />
163+
<h3 className="text-2xl font-bold text-gray-900 mb-4">Our Mission</h3>
164+
<p className="text-gray-600">
165+
To foster blockchain education, innovation, and entrepreneurship in Jharkhand by bridging
166+
the gap between traditional education and cutting-edge Web3 technologies.
167+
</p>
168+
</Card>
169+
170+
<Card className="text-center p-8">
171+
<Eye className="w-12 h-12 text-blue-600 mx-auto mb-6" />
172+
<h3 className="text-2xl font-bold text-gray-900 mb-4">Our Vision</h3>
173+
<p className="text-gray-600">
174+
To establish Jharkhand as a leading hub for Web3 innovation in India, where students
175+
and developers can Connect, Learn, Build and access Opportunities globally.
176+
</p>
177+
</Card>
178+
179+
<Card className="text-center p-8">
180+
<Heart className="w-12 h-12 text-red-600 mx-auto mb-6" />
181+
<h3 className="text-2xl font-bold text-gray-900 mb-4">Our Impact</h3>
182+
<p className="text-gray-600">
183+
Empowering 1,000+ students across 6 colleges, hosting 25+ educational events, and
184+
building real-world projects that solve local and global challenges.
185+
</p>
186+
</Card>
187+
</div>
188+
189+
{/* Values */}
190+
<div className="text-center mb-16">
191+
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Our Values</h2>
192+
<p className="text-xl text-gray-600">The principles that guide everything we do</p>
193+
</div>
194+
195+
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
196+
{values.map((value, index) => (
197+
<Card key={index} className="text-center p-6 hover:shadow-lg transition-shadow duration-300">
198+
<value.icon className="w-10 h-10 text-purple-600 mx-auto mb-4" />
199+
<h3 className="text-lg font-bold text-gray-900 mb-3">{value.title}</h3>
200+
<p className="text-gray-600 text-sm">{value.description}</p>
201+
</Card>
202+
))}
203+
</div>
204+
</div>
205+
</section>
206+
207+
{/* Our Story */}
208+
<section className="py-20 bg-gray-50">
209+
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
210+
<div className="grid md:grid-cols-2 gap-12 items-center mb-20">
211+
<div>
212+
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-6">Our Story</h2>
213+
<p className="text-gray-600 mb-6">
214+
Web3JH began in 2022 when a group of passionate students at BIT Mesra
215+
recognized the lack of blockchain education and proper resources to start in Web3.
216+
What started as informal study groups quickly grew into organized workshops, meetups,
217+
and a thriving community.
218+
</p>
219+
<p className="text-gray-600 mb-6">
220+
Today, we're proud to be Jharkhand's largest Web3 community, with active chapters
221+
in 6 colleges and partnerships with leading blockchain companies worldwide. Our members have
222+
gone on to work at top Web3 companies, start their own blockchain ventures, and contribute
223+
to open-source projects.
224+
</p>
225+
<div className="space-y-4">
226+
<div className="flex items-center space-x-3">
227+
<CheckCircle className="w-5 h-5 text-green-500" />
228+
<span className="text-gray-700">1,000+ active community members</span>
229+
</div>
230+
<div className="flex items-center space-x-3">
231+
<CheckCircle className="w-5 h-5 text-green-500" />
232+
<span className="text-gray-700">6 college chapters across Jharkhand</span>
233+
</div>
234+
<div className="flex items-center space-x-3">
235+
<CheckCircle className="w-5 h-5 text-green-500" />
236+
<span className="text-gray-700">25+ educational events, meetups and workshops</span>
237+
</div>
238+
</div>
239+
</div>
240+
<div className="relative mt-8">
241+
<img
242+
src="core-team.jpg"
243+
alt="Team collaboration"
244+
className="rounded-lg shadow-xl"
245+
/>
246+
</div>
247+
</div>
248+
249+
{/* Timeline */}
250+
{/* <div className="text-center mb-16">
251+
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Our Journey</h2>
252+
<p className="text-xl text-gray-600">Key milestones in our growth</p>
253+
</div>
254+
255+
<div className="space-y-8">
256+
{milestones.map((milestone, index) => (
257+
<div key={index} className="flex items-start space-x-4">
258+
<div className="flex-shrink-0">
259+
<div className="w-12 h-12 bg-gradient-to-r from-purple-600 to-blue-600 rounded-full flex items-center justify-center">
260+
<span className="text-white font-bold text-sm">{milestone.year}</span>
261+
</div>
262+
</div>
263+
<div className="flex-grow">
264+
<h3 className="text-lg font-bold text-gray-900 mb-2">{milestone.event}</h3>
265+
<p className="text-gray-600">{milestone.description}</p>
266+
</div>
267+
</div>
268+
))}
269+
</div> */}
270+
</div>
271+
</section>
272+
273+
{/* Team Section */}
274+
<section className="py-20 bg-white">
275+
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
276+
<div className="text-center mb-16">
277+
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Meet Our Team</h2>
278+
<p className="text-xl text-gray-600">
279+
The passionate individuals driving Web3 innovation in Jharkhand
280+
</p>
281+
</div>
282+
283+
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
284+
{team.map((member, index) => (
285+
<Card key={index} className="text-center p-6 hover:shadow-lg transition-shadow duration-300">
286+
<img
287+
src={member.image}
288+
alt={member.name}
289+
className="w-24 h-24 rounded-full mx-auto mb-4 object-cover"
290+
/>
291+
<h3 className="text-lg font-bold text-gray-900 mb-2">{member.name}</h3>
292+
<Badge variant="secondary" className="mb-3">{member.role}</Badge>
293+
<div className="flex justify-center gap-4 mt-4">
294+
<a href={member.linkedin} target="_blank" rel="noopener noreferrer">
295+
<FaLinkedin className="text-blue-600 hover:text-blue-800 text-xl" />
296+
</a>
297+
<a href={member.twitter} target="_blank" rel="noopener noreferrer">
298+
<FaTwitter className="text-sky-500 hover:text-sky-700 text-xl" />
299+
</a>
300+
</div>
301+
</Card>
302+
))}
303+
</div>
304+
</div>
305+
</section>
306+
</div>
307+
);
308+
}

0 commit comments

Comments
 (0)