From d139b67abb05c36f313b2a33903531b226bfde28 Mon Sep 17 00:00:00 2001 From: "Builder.io" Date: Fri, 7 Nov 2025 23:42:25 +0000 Subject: [PATCH] Build FoundationContribute - Contributing to open source cgen-dbba92aa6eb64e95a4c7537e57bcb13a --- .../pages/foundation/FoundationContribute.tsx | 274 +++++++++++------- .../foundation/FoundationGetInvolved.tsx | 258 ++++++++++------- .../pages/foundation/FoundationLearnMore.tsx | 273 ++++++++++------- 3 files changed, 489 insertions(+), 316 deletions(-) diff --git a/client/pages/foundation/FoundationContribute.tsx b/client/pages/foundation/FoundationContribute.tsx index 48e0bd06..199c261a 100644 --- a/client/pages/foundation/FoundationContribute.tsx +++ b/client/pages/foundation/FoundationContribute.tsx @@ -1,17 +1,66 @@ import Layout from "@/components/Layout"; import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; -import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; -import { Heart, Code, BookOpen, Globe } from "lucide-react"; +import { Card, CardContent } from "@/components/ui/card"; +import { Github, BookOpen, Users, CheckCircle, ArrowRight } from "lucide-react"; import { useNavigate } from "react-router-dom"; export default function FoundationContribute() { const navigate = useNavigate(); + const projects = [ + { + name: "AeThex Game Engine", + description: "High-performance game engine for web and native platforms", + stars: "2.5K", + language: "Rust", + difficulty: "Intermediate", + goodFirst: ["docs", "examples", "tests"], + }, + { + name: "Roblox Toolkit", + description: "Professional Roblox development library and utilities", + stars: "1.8K", + language: "Lua", + difficulty: "Beginner", + goodFirst: ["bug fixes", "documentation", "examples"], + }, + { + name: "Procedural Generation Library", + description: "Advanced PCG algorithms for game content", + stars: "980", + language: "Rust", + difficulty: "Advanced", + goodFirst: ["tests", "optimization", "examples"], + }, + ]; + + const contributionTypes = [ + { + title: "Code Contributions", + description: "Submit bug fixes, features, or optimizations", + benefits: ["Build portfolio", "Earn recognition", "Shape projects"], + }, + { + title: "Documentation", + description: "Improve guides, README files, and API docs", + benefits: ["Help community", "Easy to start", "High impact"], + }, + { + title: "Bug Reports", + description: "Find and report issues with clear details", + benefits: ["Free to start", "No coding needed", "Helps everyone"], + }, + { + title: "Translations", + description: "Help translate docs and guides to other languages", + benefits: ["Global impact", "Flexible work", "Community valued"], + }, + ]; + return (
- {/* Animated grid background */}
@@ -19,121 +68,138 @@ export default function FoundationContribute() {
- {/* Hero Section */} -
-
-
- +
+
+ - - - Contribute - +

+ Contribute to Open Source +

+

+ Help us build better tools and resources for the developer community. All skill levels welcome. +

+
+
-

- Make a Difference -

- -

- Help us democratize technology through open source. Your - contributions directly impact millions of developers - worldwide. -

- -
- - -
+ +
+
+

+ {project.name} +

+

+ {project.description} +

+
+
+ + ⭐ {project.stars} + + + {project.language} + +
+
+ +
+

+ Good for Beginners +

+
+ {project.goodFirst.map((tag, i) => ( + + {tag} + + ))} +
+ +
+
+ + ))}
- {/* Ways to Contribute */} -
+

Ways to Contribute

-
- - - - Write Code - - -

- Contribute code improvements, fixes, and new features to - our projects. -

-
-
- - - - - - Documentation - - - -

- Help improve documentation to make projects more - accessible to everyone. -

-
-
- - - - - Translations - - -

- Help us reach developers globally by translating content - into your language. -

-
-
- - - - - - Support Others - - - -

- Help community members by answering questions and - reviewing contributions. -

-
-
+
+ {contributionTypes.map((type, idx) => ( + + +

+ {type.title} +

+

+ {type.description} +

+
    + {type.benefits.map((benefit, i) => ( +
  • + + {benefit} +
  • + ))} +
+
+
+ ))}
+ +
+
+

+ Ready to Contribute? +

+

+ Choose a project and start making an impact today. +

+ +
+
diff --git a/client/pages/foundation/FoundationGetInvolved.tsx b/client/pages/foundation/FoundationGetInvolved.tsx index 8cb744bb..05c4e9ab 100644 --- a/client/pages/foundation/FoundationGetInvolved.tsx +++ b/client/pages/foundation/FoundationGetInvolved.tsx @@ -1,17 +1,70 @@ import Layout from "@/components/Layout"; import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; -import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; -import { Heart, Users, Zap, Globe } from "lucide-react"; +import { Card, CardContent } from "@/components/ui/card"; +import { Calendar, Users, Zap, Heart, ArrowRight } from "lucide-react"; import { useNavigate } from "react-router-dom"; export default function FoundationGetInvolved() { const navigate = useNavigate(); + const events = [ + { + title: "Weekly Game Dev Workshop", + date: "Every Saturday, 10 AM", + attendees: "150+/week", + level: "Beginner", + description: "Interactive sessions on game development fundamentals", + }, + { + title: "Roblox Developer Meetup", + date: "1st Thursday, 7 PM", + attendees: "50+/month", + level: "All Levels", + description: "Connect with other Roblox developers in your area", + }, + { + title: "Advanced Architecture Conference", + date: "Monthly", + attendees: "200+", + level: "Advanced", + description: "Deep dive into scalable game architecture", + }, + { + title: "Game Jam Challenge", + date: "Quarterly", + attendees: "500+", + level: "All Levels", + description: "Build a game in 48 hours and compete", + }, + ]; + + const ways = [ + { + title: "Attend Workshops", + description: "Join our free community workshops and learn from experts", + icon: , + }, + { + title: "Join Discussions", + description: "Participate in forums and ask questions in Discord", + icon: , + }, + { + title: "Volunteer", + description: "Help organize events and mentor new developers", + icon: , + }, + { + title: "Share Knowledge", + description: "Write tutorials or speak at our events", + icon: , + }, + ]; + return (
- {/* Animated grid background */}
@@ -19,120 +72,117 @@ export default function FoundationGetInvolved() {
- {/* Hero Section */} -
-
-
- +
+
+ - - - Get Involved - +

+ Get Involved in the Community +

+

+ Join 50K+ developers building and learning together. +

+
+
-

- Join Our Mission -

- -

- Many ways to get involved with the Foundation. Find the role - that fits you best and make an impact. -

- -
- - -
+ +
+
+

+ {event.title} +

+
+
+

+ WHEN +

+

+ {event.date} +

+
+
+

+ LEVEL +

+ + {event.level} + +
+
+

+ ATTENDEES +

+

+ {event.attendees} +

+
+
+
+ + ))}
- {/* Involvement Opportunities */} -
+

- How You Can Help + Ways to Participate

-
- - - - Volunteer - - -

- Dedicate your time and skills to projects that matter and - make a real difference. -

-
-
- - - - - - Spread the Word - - - -

- Help us reach more people by sharing our mission with your - network. -

-
-
- - - - - - Partner With Us - - - -

- Organizations and companies can partner with us to amplify - our impact. -

-
-
- - - - - Support Us - - -

- Help fund our initiatives and keep our work free and - accessible to all. -

-
-
+
+ {ways.map((way, idx) => ( + + +
{way.icon}
+

+ {way.title} +

+

+ {way.description} +

+
+
+ ))}
+ +
+
+

+ Ready to Join? +

+

+ Sign up for events and connect with other developers. +

+ +
+
diff --git a/client/pages/foundation/FoundationLearnMore.tsx b/client/pages/foundation/FoundationLearnMore.tsx index fb35887c..9caa800c 100644 --- a/client/pages/foundation/FoundationLearnMore.tsx +++ b/client/pages/foundation/FoundationLearnMore.tsx @@ -1,17 +1,78 @@ import Layout from "@/components/Layout"; import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; -import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; -import { BookOpen, Lightbulb, Users, Award } from "lucide-react"; +import { Card, CardContent } from "@/components/ui/card"; +import { BookOpen, Video, Code, Users, ArrowRight, GraduationCap } from "lucide-react"; import { useNavigate } from "react-router-dom"; export default function FoundationLearnMore() { const navigate = useNavigate(); + const learningPaths = [ + { + title: "Game Development Fundamentals", + description: "Master the core concepts and best practices", + duration: "6 weeks", + level: "Beginner", + format: "Video Course", + modules: 12, + }, + { + title: "Roblox Development Mastery", + description: "Build professional Roblox experiences", + duration: "8 weeks", + level: "Intermediate", + format: "Interactive Tutorial", + modules: 16, + }, + { + title: "Advanced Game Architecture", + description: "Scalable systems and optimization", + duration: "10 weeks", + level: "Advanced", + format: "Project-Based", + modules: 20, + }, + { + title: "Game Art & Animation", + description: "Create stunning visuals and smooth animations", + duration: "7 weeks", + level: "Intermediate", + format: "Video Tutorials", + modules: 14, + }, + ]; + + const resources = [ + { + type: "Documentation", + icon: , + count: "50+", + description: "Guides and API reference", + }, + { + type: "Video Tutorials", + icon: