diff --git a/.eslintignore b/.eslintignore index 6ceff293f..2f4ad0b42 100644 --- a/.eslintignore +++ b/.eslintignore @@ -35,3 +35,5 @@ yarn-error.log* # packages cli-template-* + +!apps/website/src/app/build diff --git a/.eslintrc.json b/.eslintrc.json index d9b4b80a3..81bfd3bc8 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -3,7 +3,7 @@ "env": { "es6": true }, - "extends": ["airbnb-base", "airbnb-typescript/base", "plugin:jest/recommended", "plugin:jest/style", "prettier"], + "extends": ["airbnb", "airbnb-typescript/base", "plugin:jest/recommended", "plugin:jest/style", "prettier"], "parser": "@typescript-eslint/parser", "parserOptions": { "ecmaVersion": 6, @@ -12,6 +12,12 @@ }, "plugins": ["@typescript-eslint", "jest"], "rules": { + "react/require-default-props": "off", + "react/jsx-props-no-spreading": "off", + "react/react-in-jsx-scope": "off", + "react/jsx-filename-extension": [1, { "extensions": [".tsx"] }], + "import/prefer-default-export": "off", + "import/extensions": "off", "no-underscore-dangle": "off", "import/no-extraneous-dependencies": "off", "no-bitwise": "off", diff --git a/.prettierignore b/.prettierignore index 7d9431b3d..bc9b12a74 100644 --- a/.prettierignore +++ b/.prettierignore @@ -44,4 +44,6 @@ snark-artifacts # Next.js .next/ -public \ No newline at end of file +public + +!apps/website/src/app/build diff --git a/apps/website/.gitignore b/apps/website/.gitignore new file mode 100644 index 000000000..3a80bb798 --- /dev/null +++ b/apps/website/.gitignore @@ -0,0 +1,37 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.js + +# 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 + +!src/app/build \ No newline at end of file diff --git a/apps/website/README.md b/apps/website/README.md new file mode 100644 index 000000000..5ce4a7c66 --- /dev/null +++ b/apps/website/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/apps/website/next.config.js b/apps/website/next.config.js new file mode 100644 index 000000000..dda562e2a --- /dev/null +++ b/apps/website/next.config.js @@ -0,0 +1,13 @@ +/** @type {import('next').NextConfig} */ +const nextConfig = { + images: { + remotePatterns: [ + { + protocol: "https", + hostname: "semaphore.cedoor.dev" + } + ] + } +} + +module.exports = nextConfig diff --git a/apps/website/package.json b/apps/website/package.json new file mode 100644 index 000000000..ee979e363 --- /dev/null +++ b/apps/website/package.json @@ -0,0 +1,29 @@ +{ + "name": "semaphore-website", + "version": "2.0.0", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start" + }, + "dependencies": { + "@chakra-ui/next-js": "^2.1.5", + "@chakra-ui/react": "^2.8.1", + "@chakra-ui/theme": "^3.3.0", + "@chakra-ui/theme-tools": "^2.1.1", + "@emotion/react": "^11.11.1", + "@emotion/styled": "^11.11.0", + "framer-motion": "^10.16.4", + "next": "13.5.5", + "react": "^18", + "react-code-blocks": "^0.1.4", + "react-dom": "^18" + }, + "devDependencies": { + "@types/node": "^20", + "@types/react": "^18", + "@types/react-dom": "^18", + "typescript": "^5" + } +} diff --git a/apps/website/public/apple-icon.png b/apps/website/public/apple-icon.png new file mode 100644 index 000000000..ed4cb2bca Binary files /dev/null and b/apps/website/public/apple-icon.png differ diff --git a/apps/website/public/icon.svg b/apps/website/public/icon.svg new file mode 100644 index 000000000..4d16a5525 --- /dev/null +++ b/apps/website/public/icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/apps/website/public/semaphore-icon.svg b/apps/website/public/semaphore-icon.svg new file mode 100644 index 000000000..11db9b12b --- /dev/null +++ b/apps/website/public/semaphore-icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/apps/website/public/semaphore-logo.svg b/apps/website/public/semaphore-logo.svg new file mode 100644 index 000000000..82ab73c3e --- /dev/null +++ b/apps/website/public/semaphore-logo.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/apps/website/public/social-media.png b/apps/website/public/social-media.png new file mode 100644 index 000000000..3ad281151 Binary files /dev/null and b/apps/website/public/social-media.png differ diff --git a/apps/website/src/app/build/page.tsx b/apps/website/src/app/build/page.tsx new file mode 100644 index 000000000..10a183aee --- /dev/null +++ b/apps/website/src/app/build/page.tsx @@ -0,0 +1,159 @@ +import { Flex, Link, Text, VStack, Box, Image } from "@chakra-ui/react" +import ActionCard from "../../components/ActionCard" +import ToolsCard from "../../components/ToolsCard" +import IconArrowRight from "../../icons/IconArrowRight" +import IconBook from "../../icons/IconBook" +import IconBox from "../../icons/IconBox" +import IconCli from "../../icons/IconCli" + +export default function Build() { + const toolCardsInfo = [ + { + icon: , + title: "CLI", + subtitle: "INTEGRATE TO YOUR PROJECT", + url: "https://github.com/semaphore-protocol/semaphore/tree/main/packages/cli#readme", + details: [ + "Streamline setting up a new Semaphore project", + "Interact with group, members & proofs data easily", + "Reduce set-up time from a few minutes to a few seconds" + ] + }, + { + icon: , + title: "Boilerplate", + subtitle: "START FROM TEMPLATE", + url: "https://github.com/semaphore-protocol/boilerplate", + details: [ + "Begin your projects with a ready-to-use example template", + "Create identity, join group, send anonmous feedback", + "Easily modify to align with specific project goals" + ] + }, + { + icon: , + title: "Packages", + subtitle: "LEVERAGE DEVELOPED LIBRARIES", + url: "https://github.com/semaphore-protocol/semaphore/tree/main/packages", + details: [ + "Curated libraries to enhance your development process", + "Preconfigured deployments with Hardhat plugin", + "Facilitate offchain & onchain groups, members & proofs interactions" + ] + } + ] + + const linksInfo = [ + { + title: "Good first issues", + href: "https://github.com/semaphore-protocol/semaphore/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22" + }, + { + title: "Enhance the protocol", + href: "https://github.com/semaphore-protocol/semaphore/discussions/new?category=ideas" + }, + { + title: "Give feedback about the website", + href: "https://github.com/semaphore-protocol/semaphore/discussions/new?category=website" + } + ] + return ( + + + + Let’s build something new + + + Jumpstart your app development process with these building tools. + + + + {toolCardsInfo.map((toolCardInfo) => ( + + ))} + + + + + + + + Contribute to Semaphore + + + Semaphore is open source with dozens of community contributors. You can propose improvements + to the protocol or take good first issues to get started. + + + {linksInfo.map((linkInfo) => ( + + + {linkInfo.title} + + + + ))} + + + + + + Flower Shadow + + + + + + + ) +} diff --git a/apps/website/src/app/layout.tsx b/apps/website/src/app/layout.tsx new file mode 100644 index 000000000..2ec56487e --- /dev/null +++ b/apps/website/src/app/layout.tsx @@ -0,0 +1,42 @@ +import { Box, Container } from "@chakra-ui/react" +import type { Metadata } from "next" +import Footer from "../components/Footer" +import Navbar from "../components/Navbar" +import Providers from "./providers" + +export const metadata: Metadata = { + title: "Semaphore", + description: "A zero-knowledge protocol for anonymous signaling on Ethereum.", + icons: { icon: "/icon.svg", apple: "/apple-icon.png" }, + metadataBase: new URL("https://website.semaphore.pse.dev"), + openGraph: { + type: "website", + url: "https://website.semaphore.pse.dev", + title: "Semaphore", + description: "A zero-knowledge protocol for anonymous signaling on Ethereum.", + siteName: "Semaphore", + images: [ + { + url: "https://website.semaphore.pse.dev/social-media.png" + } + ] + }, + twitter: { card: "summary_large_image", images: "https://website.semaphore.pse.dev/social-media.png" } +} + +export default function RootLayout({ children }: { children: React.ReactNode }) { + return ( + + + + + + + {children} +