rocket-connect · danstarns · Jun 7, 2024 · May 20, 2024 · May 24, 2024 · May 24, 2024
diff --git a/.github/workflows/deploy-preview.yml b/.github/workflows/deploy-preview.yml
@@ -0,0 +1,28 @@
+name: preview.rconnect.tech
+
+on:
+  push:
+    branches:
+      - new-site
+
+jobs:
+  deploy-preview:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: SSH and deploy node app
+        uses: appleboy/ssh-action@master
+        with:
+          host: ${{ secrets.SSH_HOST }}
+          username: ${{ secrets.SSH_USERNAME }}
+          key: ${{ secrets.SSH_KEY }}
+          script: |
+            export NVM_DIR=~/.nvm
+            source ~/.nvm/nvm.sh
+            cd ./preview/rconnect.tech
+            git reset --hard
+            git pull origin main
+            cd ./frontend
+            npm install
+            npm run build
+            pm2 restart preview
diff --git a/frontend/.env.example b/frontend/.env.example
diff --git a/frontend/.eslintrc.json b/frontend/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}
diff --git a/frontend/.gitignore b/frontend/.gitignore
@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
diff --git a/frontend/README.md b/frontend/README.md
@@ -0,0 +1,36 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
diff --git a/frontend/app/community/layout.tsx b/frontend/app/community/layout.tsx
@@ -0,0 +1,30 @@
+import type { Metadata } from "next";
+import { Rubik } from "next/font/google";
+import "../globals.css";
+
+const rubik = Rubik({ subsets: ["latin"] });
+
+export const metadata: Metadata = {
+  title: "Community | Rocket Connect",
+  description: "We connect people through open source.",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <head>
+        <link
+          rel="icon"
+          href="/icon?<generated>"
+          type="image/<generated>"
+          sizes="<generated>"
+        />
+      </head>
+      <body className={rubik.className}>{children}</body>
+    </html>
+  );
+}
diff --git a/frontend/app/community/page.tsx b/frontend/app/community/page.tsx
@@ -0,0 +1,32 @@
+"use client";
+import dynamic from "next/dynamic";
+import { Hero } from "@/components/shared/Hero";
+import { SocialProofSection } from "@/components/templates/SocialProofSection";
+import { Footer } from "@/components/shared/Footer";
+import { Header } from "@/components/shared/Header";
+import { Main } from "@/components/shared/Main";
+import { services } from "@/content/services";
+import { community } from "@/content/community";
+import { CommunitySection } from "@/components/templates/CommunitySection";
+import { Cta } from "@/components/shared/Cta";
+import { DirectorySection } from "@/components/templates/DirectorySection";
+
+const LazyMap = dynamic(() => import("@/components/templates/MapSection"), {
+  ssr: false,
+  loading: () => <p>Loading...</p>,
+});
+
+export default function Services() {
+  return (
+    <Main>
+      <Header />
+      <Hero content={community.hero} />
+      <SocialProofSection />
+      <LazyMap content={community.activity} />
+      <DirectorySection content={community.directory} />
+      <CommunitySection content={community.featuredVideos} />
+      <Cta />
+      <Footer />
+    </Main>
+  );
+}
diff --git a/frontend/app/contact/layout.tsx b/frontend/app/contact/layout.tsx
@@ -0,0 +1,30 @@
+import type { Metadata } from "next";
+import { Rubik } from "next/font/google";
+import "../globals.css";
+
+const rubik = Rubik({ subsets: ["latin"] });
+
+export const metadata: Metadata = {
+  title: "Contact us | Rconnect.tech",
+  description: "We connect people through open source.",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <head>
+        <link
+          rel="icon"
+          href="/icon?<generated>"
+          type="image/<generated>"
+          sizes="<generated>"
+        />
+      </head>
+      <body className={rubik.className}>{children}</body>
+    </html>
+  );
+}
diff --git a/frontend/app/contact/page.tsx b/frontend/app/contact/page.tsx
@@ -0,0 +1,34 @@
+import { Hero } from "@/components/shared/Hero";
+import { SocialProofSection } from "@/components/templates/SocialProofSection";
+import { TwoColumn } from "@/components/shared/TwoColumn";
+import { Cta } from "@/components/shared/Cta";
+import { Footer } from "@/components/shared/Footer";
+import { Header } from "@/components/shared/Header";
+import { Main } from "@/components/shared/Main";
+import { services } from "@/content/services";
+import type { Metadata } from "next";
+import Image from "next/image";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Button } from "@/components/ui/button";
+
+const content = { h1: { title: "We connect people through open source" } };
+
+export default function Services() {
+  return (
+    <Main>
+      <Header />
+      <Hero content={content} cta={false} />
+      <div className="w-full py-8">
+        <div className="max-w-2xl bg-[#FCFCFF] border border-[#E6E6FF] p-8 mx-auto rounded-lg flex flex-col gap-4 items-center">
+          <Input placeholder="Your name" />
+          <Input placeholder="Your email" />
+          <Textarea placeholder="Your message" />
+          <Button>Send your message</Button>
+        </div>
+      </div>
+      <SocialProofSection />
+      <Footer />
+    </Main>
+  );
+}
diff --git a/frontend/app/globals.css b/frontend/app/globals.css
@@ -0,0 +1,25 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --foreground: #1A2735;
+  --background: #FFFFFF;
+
+}
+
+body {
+  color: var(--foreground);
+  background:var(--background)
+}
+
+@layer utilities {
+  .text-balance {
+    text-wrap: balance;
+  }
+}
+
+.leaflet-div-icon {
+  background: transparent !important;
+  border: none !important;
+}
diff --git a/frontend/app/icon.tsx b/frontend/app/icon.tsx
@@ -0,0 +1,57 @@
+import { ImageResponse } from "next/og";
+import React from "react";
+
+// Route segment config
+export const runtime = "edge";
+
+// Image metadata
+export const size = {
+  width: 32,
+  height: 32,
+};
+export const contentType = "image/png";
+
+// Image generation
+export default function Icon() {
+  return new ImageResponse(
+    (
+      <div
+        style={{
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+        }}
+      >
+        <svg
+          width="32"
+          height="32"
+          viewBox="0 0 56 57"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M54.117 24.0235L32.5459 2.45229C30.0352 -0.0583174 25.9647 -0.058314 23.4541 2.45229L1.88295 24.0235C-0.627653 26.5341 -0.62765 30.6046 1.88296 33.1152L23.4541 54.6864C25.9647 57.197 30.0352 57.197 32.5459 54.6864L54.117 33.1152C56.6277 30.6046 56.6277 26.5341 54.117 24.0235Z"
+            fill="#1A2735"
+          />
+          <path
+            d="M31.6403 28.3488H26.7038C25.6329 28.3488 25.0533 29.6238 25.7477 30.4525L32.3485 38.3311C32.5871 38.6159 32.9366 38.78 33.3047 38.78H38.2411C39.3121 38.78 39.8916 37.505 39.1973 36.6763L32.5964 28.7977C32.3578 28.5129 32.0083 28.3488 31.6403 28.3488Z"
+            fill="#FFBF14"
+          />
+          <path
+            d="M38.4201 19.455C37.4713 18.3529 36.1005 17.7207 34.6595 17.7207H19.067C17.5194 17.7207 16.2649 18.9957 16.2649 20.5684C16.2649 22.1412 17.5194 23.4162 19.067 23.4162H31.54C32.5873 23.4162 33.5899 23.8482 34.318 24.6133L34.7976 25.1174C36.058 26.4418 38.1483 26.4384 39.4045 25.1099C40.5547 23.8935 40.5985 21.9853 39.5055 20.7157L38.4201 19.455Z"
+            fill="#C4C7CA"
+          />
+          <path
+            d="M16.189 31.441C16.189 29.855 17.4541 28.5693 19.0147 28.5693C20.5752 28.5693 21.8403 29.855 21.8403 31.441V36.5463C21.8403 38.1323 20.5752 39.4179 19.0147 39.4179C17.4541 39.4179 16.189 38.1323 16.189 36.5463V31.441Z"
+            fill="#00A5AA"
+          />
+        </svg>
+      </div>
+    ),
+    {
+      ...size,
+    }
+  );
+}
diff --git a/frontend/app/layout.tsx b/frontend/app/layout.tsx
@@ -0,0 +1,30 @@
+import type { Metadata } from "next";
+import { Rubik } from "next/font/google";
+import "./globals.css";
+
+const rubik = Rubik({ subsets: ["latin"] });
+
+export const metadata: Metadata = {
+  title: "Rocket Connect",
+  description: "We connect people through open source.",
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <head>
+        <link
+          rel="icon"
+          href="/icon?<generated>"
+          type="image/<generated>"
+          sizes="<generated>"
+        />
+      </head>
+      <body className={rubik.className}>{children}</body>
+    </html>
+  );
+}
diff --git a/frontend/app/page.tsx b/frontend/app/page.tsx
@@ -0,0 +1,23 @@
+import { CommunitySection } from "@/components/templates/CommunitySection";
+import { Hero } from "@/components/shared/Hero";
+import { ServicesSection } from "@/components/templates/ServicesSection";
+import { SocialProofSection } from "@/components/templates/SocialProofSection";
+import { Cta } from "@/components/shared/Cta";
+import { Footer } from "@/components/shared/Footer";
+import { Header } from "@/components/shared/Header";
+import { Main } from "@/components/shared/Main";
+import { home } from "@/content/home";
+
+export default function Home() {
+  return (
+    <Main>
+      <Header />
+      <Hero content={home.hero} />
+      <SocialProofSection />
+      <ServicesSection content={home.services} />
+      <CommunitySection content={home.community} />
+      <Cta />
+      <Footer />
+    </Main>
+  );
+}