Merge version_1_1782056888554 into main #1
@@ -14,310 +14,163 @@ import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroSplitMediaGrid
|
||||
tag="Launch Your Career"
|
||||
title="Master the Future with Northstar Academy"
|
||||
description="Join the premier bootcamp for aspiring software engineers. Accelerate your career with industry-led mentorship, practical projects, and a global network of professionals."
|
||||
primaryButton={{
|
||||
text: "Apply Now",
|
||||
href: "#application",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Curriculum",
|
||||
href: "#curriculum",
|
||||
}}
|
||||
items={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-fractal-background-with-explosion-effect_1048-7331.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/isolated-screen-laptop-man-coding-server-farm-while-listening-music_482257-123629.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Launch Your Career"
|
||||
title="Master the Future with Northstar Academy"
|
||||
description="Join the premier bootcamp for aspiring software engineers. Accelerate your career with industry-led mentorship, practical projects, and a global network of professionals."
|
||||
primaryButton={{
|
||||
text: "Apply Now", href: "#application"}}
|
||||
secondaryButton={{
|
||||
text: "View Curriculum", href: "#curriculum"}}
|
||||
items={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-fractal-background-with-explosion-effect_1048-7331.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/isolated-screen-laptop-man-coding-server-farm-while-listening-music_482257-123629.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SectionErrorBoundary name="social-proof">
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SectionErrorBoundary name="social-proof">
|
||||
<SocialProofMarquee
|
||||
tag="Trusted By Industry Leaders"
|
||||
title="Our graduates are hired by top-tier firms"
|
||||
description="Join thousands of alumni building the future at these organizations."
|
||||
names={[
|
||||
"Google",
|
||||
"Amazon",
|
||||
"Microsoft",
|
||||
"Meta",
|
||||
"Stripe",
|
||||
"Netflix",
|
||||
"Spotify",
|
||||
"Uber",
|
||||
"Airbnb",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Trusted By Industry Leaders"
|
||||
title="Our graduates are hired by top-tier firms"
|
||||
description="Join thousands of alumni building the future at these organizations."
|
||||
names={["Google", "Amazon", "Microsoft", "Meta", "Stripe", "Netflix", "Spotify", "Uber", "Airbnb"]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="curriculum" data-section="curriculum">
|
||||
<SectionErrorBoundary name="curriculum">
|
||||
<div id="curriculum" data-section="curriculum">
|
||||
<SectionErrorBoundary name="curriculum">
|
||||
<FeaturesRevealCards
|
||||
tag="Program Roadmap"
|
||||
title="A 16-Week Intensive Curriculum"
|
||||
description="From fundamentals to advanced deployment, gain mastery over modern full-stack development."
|
||||
items={[
|
||||
{
|
||||
title: "Fundamentals",
|
||||
description: "HTML, CSS, and advanced JavaScript concepts.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/motherboard-circuit-technology-background-gradient-blue_53876-124654.jpg",
|
||||
},
|
||||
{
|
||||
title: "Frontend Mastery",
|
||||
description: "Deep dive into React, State Management, and Performance.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/it-engineer-working-with-his-pc_1098-21511.jpg",
|
||||
},
|
||||
{
|
||||
title: "Backend Architecture",
|
||||
description: "Node.js, Express, and Database design (SQL/NoSQL).",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-cybersecurity-concept-design_23-2151841648.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Program Roadmap"
|
||||
title="A 16-Week Intensive Curriculum"
|
||||
description="From fundamentals to advanced deployment, gain mastery over modern full-stack development."
|
||||
items={[
|
||||
{ title: "Fundamentals", description: "HTML, CSS, and advanced JavaScript concepts.", imageSrc: "http://img.b2bpic.net/free-photo/motherboard-circuit-technology-background-gradient-blue_53876-124654.jpg" },
|
||||
{ title: "Frontend Mastery", description: "Deep dive into React, State Management, and Performance.", imageSrc: "http://img.b2bpic.net/free-photo/it-engineer-working-with-his-pc_1098-21511.jpg" },
|
||||
{ title: "Backend Architecture", description: "Node.js, Express, and Database design (SQL/NoSQL).", imageSrc: "http://img.b2bpic.net/free-photo/abstract-cybersecurity-concept-design_23-2151841648.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="stats" data-section="stats">
|
||||
<SectionErrorBoundary name="stats">
|
||||
<div id="stats" data-section="stats">
|
||||
<SectionErrorBoundary name="stats">
|
||||
<MetricsIconCards
|
||||
tag="Proven Results"
|
||||
title="Impact that speaks for itself"
|
||||
description="We are committed to your long-term success."
|
||||
metrics={[
|
||||
{
|
||||
icon: CheckCircle,
|
||||
title: "Hiring Rate",
|
||||
value: "94%",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Average Salary Increase",
|
||||
value: "$35k",
|
||||
},
|
||||
{
|
||||
icon: Star,
|
||||
title: "Student Satisfaction",
|
||||
value: "4.9/5",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Proven Results"
|
||||
title="Impact that speaks for itself"
|
||||
description="We are committed to your long-term success."
|
||||
metrics={[
|
||||
{ icon: "CheckCircle", title: "Hiring Rate", value: "94%" },
|
||||
{ icon: "Award", title: "Average Salary Increase", value: "$35k" },
|
||||
{ icon: "Star", title: "Student Satisfaction", value: "4.9/5" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="application" data-section="application">
|
||||
<SectionErrorBoundary name="application">
|
||||
<div id="application" data-section="application">
|
||||
<SectionErrorBoundary name="application">
|
||||
<FeaturesRevealCardsBento
|
||||
tag="Enrollment Process"
|
||||
title="Your journey to professional developer"
|
||||
description="Follow these steps to launch your new career."
|
||||
items={[
|
||||
{
|
||||
title: "Submit Application",
|
||||
description: "Start your journey today.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/four-elements-process-chart-template-business-data_1262-12006.jpg",
|
||||
},
|
||||
{
|
||||
title: "Coding Assessment",
|
||||
description: "Show your basic proficiency.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/rag-doll-collared-shouelder_1156-198.jpg",
|
||||
},
|
||||
{
|
||||
title: "Virtual Interview",
|
||||
description: "Meet the admissions team.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/badge-icon-front-side-with-white-background_187299-39772.jpg",
|
||||
},
|
||||
{
|
||||
title: "Admission Offer",
|
||||
description: "Get accepted to the academy.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/welcome-3d-text-gold-fancy-typography-illustration_53876-128749.jpg",
|
||||
},
|
||||
{
|
||||
title: "Enrollment",
|
||||
description: "Secure your spot in the cohort.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/timeline-infographic-presentation-concept_23-2148452610.jpg",
|
||||
},
|
||||
{
|
||||
title: "Onboarding",
|
||||
description: "Get set up for day one.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/instructor-helping-new-employees-with-corporate-software_74855-2188.jpg",
|
||||
},
|
||||
{
|
||||
title: "Start Bootcamp",
|
||||
description: "Begin the transformative journey.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-latin-friends-hanging-out_23-2151139477.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Enrollment Process"
|
||||
title="Your journey to professional developer"
|
||||
description="Follow these steps to launch your new career."
|
||||
items={[
|
||||
{ title: "Submit Application", description: "Start your journey today.", href: "#", imageSrc: "http://img.b2bpic.net/free-vector/four-elements-process-chart-template-business-data_1262-12006.jpg" },
|
||||
{ title: "Coding Assessment", description: "Show your basic proficiency.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/rag-doll-collared-shouelder_1156-198.jpg" },
|
||||
{ title: "Virtual Interview", description: "Meet the admissions team.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/badge-icon-front-side-with-white-background_187299-39772.jpg" },
|
||||
{ title: "Admission Offer", description: "Get accepted to the academy.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/welcome-3d-text-gold-fancy-typography-illustration_53876-128749.jpg" },
|
||||
{ title: "Enrollment", description: "Secure your spot in the cohort.", href: "#", imageSrc: "http://img.b2bpic.net/free-vector/timeline-infographic-presentation-concept_23-2148452610.jpg" },
|
||||
{ title: "Onboarding", description: "Get set up for day one.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/instructor-helping-new-employees-with-corporate-software_74855-2188.jpg" },
|
||||
{ title: "Start Bootcamp", description: "Begin the transformative journey.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/front-view-latin-friends-hanging-out_23-2151139477.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="instructors" data-section="instructors">
|
||||
<SectionErrorBoundary name="instructors">
|
||||
<div id="instructors" data-section="instructors">
|
||||
<SectionErrorBoundary name="instructors">
|
||||
<TeamStackedCards
|
||||
tag="Our Mentors"
|
||||
title="Learn from senior professionals"
|
||||
description="Guidance from industry leaders across Big Tech."
|
||||
members={[
|
||||
{
|
||||
name: "Alex Rivers",
|
||||
role: "Senior Engineer at Google",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-business-man-office-holding-tablet_1303-24053.jpg",
|
||||
},
|
||||
{
|
||||
name: "Maya Singh",
|
||||
role: "Lead Architect at Amazon",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-business-woman-standing-suit-office_1303-22800.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jordan Lee",
|
||||
role: "Staff Developer at Stripe",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-technician-data-center-monitoring-system-performance_482257-125692.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Our Mentors"
|
||||
title="Learn from senior professionals"
|
||||
description="Guidance from industry leaders across Big Tech."
|
||||
members={[
|
||||
{ name: "Alex Rivers", role: "Senior Engineer at Google", imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-business-man-office-holding-tablet_1303-24053.jpg" },
|
||||
{ name: "Maya Singh", role: "Lead Architect at Amazon", imageSrc: "http://img.b2bpic.net/free-photo/young-business-woman-standing-suit-office_1303-22800.jpg" },
|
||||
{ name: "Jordan Lee", role: "Staff Developer at Stripe", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-technician-data-center-monitoring-system-performance_482257-125692.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingSplitCards
|
||||
tag="Simple Pricing"
|
||||
title="Invest in your future"
|
||||
plans={[
|
||||
{
|
||||
tag: "Popular",
|
||||
price: "$5,000",
|
||||
period: "upfront",
|
||||
description: "Pay upfront and save significantly on your tuition.",
|
||||
primaryButton: {
|
||||
text: "Apply Now",
|
||||
href: "#",
|
||||
},
|
||||
featuresTitle: "Everything included:",
|
||||
features: [
|
||||
"16 weeks curriculum",
|
||||
"Personal mentor",
|
||||
"Career coaching",
|
||||
"Alumni access",
|
||||
],
|
||||
},
|
||||
{
|
||||
tag: "Installments",
|
||||
price: "$6,500",
|
||||
period: "in installments",
|
||||
description: "Pay over 12 months with no interest.",
|
||||
primaryButton: {
|
||||
text: "Apply Now",
|
||||
href: "#",
|
||||
},
|
||||
featuresTitle: "Includes:",
|
||||
features: [
|
||||
"16 weeks curriculum",
|
||||
"Personal mentor",
|
||||
"Career coaching",
|
||||
"Alumni access",
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Simple Pricing"
|
||||
title="Invest in your future"
|
||||
description="Transparent pricing with flexible options."
|
||||
plans={[
|
||||
{
|
||||
tag: "Popular", price: "$5,000", period: "upfront", description: "Pay upfront and save significantly on your tuition.", primaryButton: { text: "Apply Now", href: "#" },
|
||||
featuresTitle: "Everything included:", features: ["16 weeks curriculum", "Personal mentor", "Career coaching", "Alumni access"],
|
||||
},
|
||||
{
|
||||
tag: "Installments", price: "$6,500", period: "in installments", description: "Pay over 12 months with no interest.", primaryButton: { text: "Apply Now", href: "#" },
|
||||
featuresTitle: "Includes:", features: ["16 weeks curriculum", "Personal mentor", "Career coaching", "Alumni access"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialTrustCard
|
||||
quote="Northstar Academy completely changed my life. I went from retail to a Senior Role at a top company in just 6 months."
|
||||
rating={5}
|
||||
author="Sarah D., Alum"
|
||||
avatars={[
|
||||
{
|
||||
name: "Sarah D.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hispanic-young-man-smiling-wearing-headphones-university-campus_839833-11696.jpg",
|
||||
},
|
||||
{
|
||||
name: "John K.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg",
|
||||
},
|
||||
{
|
||||
name: "Maria L.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-isolated-white-portrait-young-beautiful-cheerful-dark-skinned-male-university-student-with-afro-hairstyle-white-t-shirt-denim-jacket-smiling-brightly-camera-copy-space_176420-13028.jpg",
|
||||
},
|
||||
{
|
||||
name: "Kevin B.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-black-man-white_285396-372.jpg",
|
||||
},
|
||||
{
|
||||
name: "Elena P.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/outdoor-portrait-modern-young-queer-girl-female-student-glasses-denim-jacket-going-home-after-classes-turn-back-smile-camera-waiting-friend-walking-sunny-street_197531-22151.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
quote="Northstar Academy completely changed my life. I went from retail to a Senior Role at a top company in just 6 months."
|
||||
rating={5}
|
||||
author="Sarah D., Alum"
|
||||
avatars={[
|
||||
{ name: "Sarah D.", imageSrc: "http://img.b2bpic.net/free-photo/hispanic-young-man-smiling-wearing-headphones-university-campus_839833-11696.jpg" },
|
||||
{ name: "John K.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg" },
|
||||
{ name: "Maria L.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-isolated-white-portrait-young-beautiful-cheerful-dark-skinned-male-university-student-with-afro-hairstyle-white-t-shirt-denim-jacket-smiling-brightly-camera-copy-space_176420-13028.jpg" },
|
||||
{ name: "Kevin B.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-black-man-white_285396-372.jpg" },
|
||||
{ name: "Elena P.", imageSrc: "http://img.b2bpic.net/free-photo/outdoor-portrait-modern-young-queer-girl-female-student-glasses-denim-jacket-going-home-after-classes-turn-back-smile-camera-waiting-friend-walking-sunny-street_197531-22151.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Help Center"
|
||||
title="Frequently Asked Questions"
|
||||
description="Get clear answers to the most common queries about our program."
|
||||
items={[
|
||||
{
|
||||
question: "Do I need coding experience?",
|
||||
answer: "We welcome absolute beginners and experienced enthusiasts alike.",
|
||||
},
|
||||
{
|
||||
question: "What is the schedule?",
|
||||
answer: "The program is full-time, requiring about 40 hours per week.",
|
||||
},
|
||||
{
|
||||
question: "Is it remote?",
|
||||
answer: "Yes, we are 100% remote with live global cohort sessions.",
|
||||
},
|
||||
{
|
||||
question: "Do you help with jobs?",
|
||||
answer: "We provide dedicated career coaching, portfolio reviews, and resume help.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-3d-button_23-2149917528.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Help Center"
|
||||
title="Frequently Asked Questions"
|
||||
description="Get clear answers to the most common queries about our program."
|
||||
items={[
|
||||
{ question: "Do I need coding experience?", answer: "We welcome absolute beginners and experienced enthusiasts alike." },
|
||||
{ question: "What is the schedule?", answer: "The program is full-time, requiring about 40 hours per week." },
|
||||
{ question: "Is it remote?", answer: "Yes, we are 100% remote with live global cohort sessions." },
|
||||
{ question: "Do you help with jobs?", answer: "We provide dedicated career coaching, portfolio reviews, and resume help." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-3d-button_23-2149917528.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Stay Updated"
|
||||
text="Join our newsletter for career tips, tech updates, and cohort opening alerts."
|
||||
primaryButton={{
|
||||
text: "Subscribe",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Contact Support",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Stay Updated"
|
||||
text="Join our newsletter for career tips, tech updates, and cohort opening alerts."
|
||||
primaryButton={{ text: "Subscribe", href: "#" }}
|
||||
secondaryButton={{ text: "Contact Support", href: "#" }}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user