Initial commit
This commit is contained in:
419
src/app/page.tsx
Normal file
419
src/app/page.tsx
Normal file
@@ -0,0 +1,419 @@
|
||||
"use client"
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
||||
import ParallaxAbout from '@/components/sections/about/ParallaxAbout';
|
||||
import FeatureCardTwenty from '@/components/sections/feature/FeatureCardTwenty';
|
||||
import ProductCardSeven from '@/components/sections/product/ProductCardSeven';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
import TeamCardFive from '@/components/sections/team/TeamCardFive';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
|
||||
import { Zap, Target, Sparkles, Rocket, Award, Users, HelpCircle, Youtube, Linkedin, Twitter, Github } from "lucide-react";
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="mediumSizeLargeTitles"
|
||||
background="circleGradient"
|
||||
cardStyle="layered-gradient"
|
||||
primaryButtonStyle="outline"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
brandName="Start Code"
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Courses", id: "courses" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
button={{
|
||||
text: "Enroll Now",
|
||||
href: "contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
title="Master Modern Technology"
|
||||
description="Learn industry-leading IT skills through hands-on training and expert instruction. Build your future in web development, cybersecurity, and data science."
|
||||
tag="IT Excellence"
|
||||
tagIcon={Zap}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492693670-lj7ueobz.png",
|
||||
imageAlt: "Students coding in classroom"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672727126-a97a9rhj.jpg",
|
||||
imageAlt: "Developer working on computer"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672729251-otls1mux.jpg",
|
||||
imageAlt: "Programming code on screen"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492694761-e96hadsf.jpg",
|
||||
imageAlt: "IT classroom with computers"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672728464-s6bmwda4.jpg",
|
||||
imageAlt: "Collaborative team workspace"
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Courses",
|
||||
href: "courses"
|
||||
},
|
||||
{
|
||||
text: "Get in Touch",
|
||||
href: "contact"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<ParallaxAbout
|
||||
title="Building Future Tech Leaders"
|
||||
description="Start Code is dedicated to providing comprehensive IT education that bridges the gap between academic theory and real-world industry demands. Our expert instructors bring years of professional experience to every course, ensuring students gain practical skills needed for success."
|
||||
tag="About Us"
|
||||
tagIcon={Target}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672728464-s6bmwda4.jpg"
|
||||
imageAlt="Professional IT workspace"
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn Our Mission",
|
||||
href: "contact"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwenty
|
||||
title="Why Choose Start Code"
|
||||
description="We offer a comprehensive approach to IT education with modern facilities, expert instruction, and job-focused curriculum that prepares you for real-world challenges."
|
||||
images={[
|
||||
{
|
||||
id: 1,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492695669-hy749o3o.jpg",
|
||||
imageAlt: "Web development training"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672730035-e2exv3ex.jpg",
|
||||
imageAlt: "Backend programming instruction"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766750470920-ue3bb9wg.jpg",
|
||||
imageAlt: "Database management course"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672731012-02y7h7no.jpg",
|
||||
imageAlt: "Cybersecurity training"
|
||||
}
|
||||
]}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="noInvert"
|
||||
tag="Our Programs"
|
||||
tagIcon={Sparkles}
|
||||
buttons={[
|
||||
{
|
||||
text: "View All Programs",
|
||||
href: "courses"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="courses" data-section="courses">
|
||||
<ProductCardSeven
|
||||
title="Our IT Courses"
|
||||
description="Choose from our carefully designed courses tailored to match industry demands and career advancement opportunities."
|
||||
tag="Enrollment"
|
||||
tagIcon={Rocket}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Web Development Fundamentals",
|
||||
price: "$499",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766672731963-dy25hbg0.jpg",
|
||||
imageAlt: "Web Development course"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Python Programming Essentials",
|
||||
price: "$449",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766740382604-lxm5r8ne.jpg",
|
||||
imageAlt: "Python Programming course"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Data Science & Analytics",
|
||||
price: "$599",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766750472136-03c1edmk.jpg",
|
||||
imageAlt: "Data Science course"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Cybersecurity Mastery",
|
||||
price: "$649",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766750473080-tf9sz4t0.jpg",
|
||||
imageAlt: "Cybersecurity course"
|
||||
}
|
||||
]}
|
||||
gridVariant="uniform-all-items-equal"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="noInvert"
|
||||
buttons={[
|
||||
{
|
||||
text: "Browse All Courses",
|
||||
href: "contact"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484714329-4i8nds16.jpg",
|
||||
imageAlt: "Sarah Johnson"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael Chen",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492698706-udp5pns4.jpg",
|
||||
imageAlt: "Michael Chen"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emma Rodriguez",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766743064968-mn7r0vxe.jpg",
|
||||
imageAlt: "Emma Rodriguez"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766743065834-k1ycryfc.jpg",
|
||||
imageAlt: "David Kim"
|
||||
}
|
||||
]}
|
||||
cardTitle="Over 5,000 students have successfully completed our IT courses and launched their tech careers"
|
||||
cardTag="Student Success"
|
||||
cardTagIcon={Award}
|
||||
useInvertedBackground="noInvert"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardFive
|
||||
title="Expert Instructors"
|
||||
description="Learn from industry professionals with years of real-world experience in software development, cybersecurity, and IT infrastructure."
|
||||
tag="Our Team"
|
||||
tagIcon={Users}
|
||||
team={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Robert Chen",
|
||||
role: "Senior Developer & Course Lead",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484712325-ocj12p51.jpg",
|
||||
imageAlt: "Robert Chen"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Lisa Patterson",
|
||||
role: "Cybersecurity Specialist",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484716089-kpbfo3ho.jpg",
|
||||
imageAlt: "Lisa Patterson"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "James Wilson",
|
||||
role: "Full Stack Developer",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766492697041-9adqfrju.jpg",
|
||||
imageAlt: "James Wilson"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Amanda Foster",
|
||||
role: "Data Science Mentor",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484718833-8686x51w.jpg",
|
||||
imageAlt: "Amanda Foster"
|
||||
}
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="noInvert"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
title="Frequently Asked Questions"
|
||||
description="Find answers to common questions about our courses, enrollment process, and learning experience."
|
||||
tag="Help & Support"
|
||||
tagIcon={HelpCircle}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground="noInvert"
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What is the minimum experience level required?",
|
||||
content: "Our courses are designed for learners of all levels. We offer beginner-friendly courses for those new to IT, as well as advanced programs for experienced professionals looking to specialize."
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "How long are the courses?",
|
||||
content: "Course duration varies from 4 weeks for intensive bootcamps to 12 weeks for comprehensive programs. We also offer flexible learning options with self-paced modules."
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you offer job placement assistance?",
|
||||
content: "Yes! We provide career counseling, resume review, interview preparation, and connect graduates with our network of hiring partners in the IT industry."
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "What is your refund policy?",
|
||||
content: "We offer a 14-day money-back guarantee if you're not satisfied with your course. After 14 days, refunds are handled on a case-by-case basis."
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "Do you offer flexible payment options?",
|
||||
content: "Yes, we support multiple payment methods including installment plans, corporate training discounts, and financing options for eligible students."
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
title: "Are courses available online?",
|
||||
content: "Most of our courses are available both in-person and online. Check individual course pages to see the available learning formats."
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
text="Ready to transform your career in technology? Get in touch with our enrollment team to discuss your learning goals and find the perfect course for you."
|
||||
animationType="reveal-blur"
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "contact"
|
||||
},
|
||||
{
|
||||
text: "Schedule a Call",
|
||||
href: "contact"
|
||||
}
|
||||
]}
|
||||
useInvertedBackground="noInvert"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseSocial
|
||||
logoText="Start Code"
|
||||
description="Empowering the next generation of IT professionals with quality education and career support."
|
||||
copyrightText="© 2025 Start Code. All rights reserved."
|
||||
columns={[
|
||||
{
|
||||
title: "Courses",
|
||||
items: [
|
||||
{
|
||||
label: "Web Development",
|
||||
href: "courses"
|
||||
},
|
||||
{
|
||||
label: "Python Programming",
|
||||
href: "courses"
|
||||
},
|
||||
{
|
||||
label: "Data Science",
|
||||
href: "courses"
|
||||
},
|
||||
{
|
||||
label: "Cybersecurity",
|
||||
href: "courses"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "about"
|
||||
},
|
||||
{
|
||||
label: "Team",
|
||||
href: "team"
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "contact"
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "contact"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "terms"
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "privacy"
|
||||
}
|
||||
]
|
||||
}
|
||||
]}
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Youtube,
|
||||
href: "https://youtube.com",
|
||||
ariaLabel: "YouTube"
|
||||
},
|
||||
{
|
||||
icon: Linkedin,
|
||||
href: "https://linkedin.com",
|
||||
ariaLabel: "LinkedIn"
|
||||
},
|
||||
{
|
||||
icon: Twitter,
|
||||
href: "https://twitter.com",
|
||||
ariaLabel: "Twitter"
|
||||
},
|
||||
{
|
||||
icon: Github,
|
||||
href: "https://github.com",
|
||||
ariaLabel: "GitHub"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user