626 lines
27 KiB
TypeScript
626 lines
27 KiB
TypeScript
'use client'
|
|
/* eslint-disable @next/next/no-img-element */
|
|
import { Fragment, useEffect } from 'react'
|
|
import { FaDiscord, FaGithub } from 'react-icons/fa'
|
|
import HuggingFaceSVG from '@/assets/icons/huggingface.svg'
|
|
import CuteRobotBgMountainPNG from '@/assets/landing/cute-robot-bg-mountain.png'
|
|
import { Button } from '@/components/ui/button'
|
|
import CodeSVG from '@/assets/icons/code.svg'
|
|
import { IoMdPeople } from 'react-icons/io'
|
|
import CuteBuildingRobotPNG from '@/assets/landing/cute-building-robot.png'
|
|
import CuteRobotFlyingPNG from '@/assets/landing/cute-robot-flying.png'
|
|
import ShareSVG from '@/assets/icons/share-android.svg'
|
|
import RobotSVG from '@/assets/icons/robot.svg'
|
|
import LogoJanSVG from '@/assets/icons/logo-jan.svg'
|
|
import AppJanPNG from '@/assets/landing/app-jan.png'
|
|
import TweetSection from '@/components/TweetSection'
|
|
import FavoriteModels from '@/components/FavoriteModels'
|
|
import { DropdownButton } from '@/components/ui/dropdown-button'
|
|
|
|
import { useData } from 'nextra/data'
|
|
import { useDiscordWidget } from '@/hooks/useDiscordWidget'
|
|
import { formatCompactNumber, totalDownload } from '@/utils/format'
|
|
|
|
const Home = () => {
|
|
const { lastVersion, lastRelease, stars, release } = useData()
|
|
const { data: discordWidget } = useDiscordWidget()
|
|
|
|
useEffect(() => {
|
|
const observerOptions = {
|
|
threshold: 0.1,
|
|
rootMargin: '0px 0px -50px 0px',
|
|
}
|
|
|
|
const observer = new IntersectionObserver((entries) => {
|
|
entries.forEach((entry) => {
|
|
if (entry.isIntersecting) {
|
|
const element = entry.target as HTMLElement
|
|
const delay = element.dataset.delay || '0'
|
|
|
|
setTimeout(() => {
|
|
element.classList.add('animate-in-view')
|
|
}, parseInt(delay))
|
|
|
|
observer.unobserve(element)
|
|
}
|
|
})
|
|
}, observerOptions)
|
|
|
|
// Observe all scroll-triggered animation elements
|
|
const animatedElements = document.querySelectorAll(
|
|
'.animate-on-scroll, .animate-on-scroll-left, .animate-on-scroll-right, .animate-on-scroll-scale, .animate-slide-up'
|
|
)
|
|
|
|
animatedElements.forEach((element) => {
|
|
observer.observe(element)
|
|
})
|
|
|
|
// Simple parallax effect for robot images
|
|
const handleScroll = () => {
|
|
const parallaxElements = document.querySelectorAll('.parallax-element')
|
|
|
|
parallaxElements.forEach((el) => {
|
|
const element = el as HTMLElement
|
|
const rect = element.getBoundingClientRect()
|
|
|
|
// Only apply parallax when element is visible
|
|
if (rect.top < window.innerHeight && rect.bottom > 0) {
|
|
const speed = parseFloat(element.getAttribute('data-speed') || '0.3')
|
|
// Simple calculation: how far the element has moved into/through viewport
|
|
const progress = Math.min(
|
|
1,
|
|
Math.max(0, (window.innerHeight - rect.top) / window.innerHeight)
|
|
)
|
|
// Move from 0 to -40px based on progress
|
|
const yPos = Math.round(progress * -100 * speed)
|
|
element.style.transform = `translateY(${yPos}px)`
|
|
}
|
|
})
|
|
}
|
|
|
|
window.addEventListener('scroll', handleScroll)
|
|
|
|
// Cleanup function
|
|
return () => {
|
|
observer.disconnect()
|
|
window.removeEventListener('scroll', handleScroll)
|
|
}
|
|
}, [])
|
|
|
|
return (
|
|
<Fragment>
|
|
{/* Hero */}
|
|
<section className="px-3 pt-3">
|
|
<div className="bg-[#458edf] relative py-10 h-[760px] md:h-[900px] 2xl:h-[1080px] rounded-2xl overflow-hidden">
|
|
<div className="container mx-auto relative z-10">
|
|
<div className="flex justify-center items-center mt-14 lg:mt-20 px-4">
|
|
<a
|
|
href=""
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="bg-black/40 px-3 lg:px-4 rounded-full h-10 inline-flex items-center max-w-full animate-fade-in delay-100"
|
|
>
|
|
<span className="bg-black/20 border border-neutral-700 mr-2 -ml-1 rounded-full px-2 text-white font-medium text-xs lg:text-sm">
|
|
NEW
|
|
</span>
|
|
<span className="text-white text-xs md:text-sm lg:text-base truncate font-medium">
|
|
✨ <span className="font-medium">{lastVersion}</span> is now
|
|
live on GitHub. Check it out!
|
|
</span>
|
|
</a>
|
|
</div>
|
|
<div className="mt-10">
|
|
<div className="text-center relative lg:w-1/2 mx-auto">
|
|
<div className="flex flex-col lg:flex-row items-center justify-center gap-4 animate-fade-in-up delay-300">
|
|
<span>
|
|
<img
|
|
src={LogoJanSVG.src}
|
|
alt="Logo Jan"
|
|
className="size-20 animate-wave"
|
|
/>
|
|
</span>
|
|
<h1 className="text-[40px] lg:text-[80px] font-semibold -tracking-[2px] text-white">
|
|
Ask Jan
|
|
</h1>
|
|
</div>
|
|
<p className="px-4 lg:px-0 mt-2 text-lg lg:text-2xl font-medium leading-relaxed text-white animate-fade-in-up delay-500 -tracking-[0.6px]">
|
|
Jan is the open-source ChatGPT replacement.
|
|
</p>
|
|
</div>
|
|
<div className="flex px-4 flex-col lg:flex-row items-center gap-4 w-full justify-center text-center animate-fade-in-up delay-600 mt-8 lg:mt-10">
|
|
<DropdownButton
|
|
size="xxl"
|
|
className="w-full !rounded-[20px] lg:w-auto"
|
|
lastRelease={lastRelease}
|
|
/>
|
|
<a
|
|
href="https://discord.com/invite/FTk2MvZwJH"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="w-full lg:w-auto"
|
|
>
|
|
<Button
|
|
variant="playful-white"
|
|
size="xxl"
|
|
className="!w-full lg:w-auto !items-center border-2"
|
|
>
|
|
<FaDiscord className="size-5 text-[#5765F2]" />
|
|
Join community
|
|
<div className="flex items-center gap-1 ml-3">
|
|
<svg
|
|
width="19"
|
|
height="18"
|
|
viewBox="0 0 19 18"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<g clipPath="url(#clip0_1299_2107)">
|
|
<path
|
|
d="M3.12524 5.25C3.12524 3.59315 4.46839 2.25 6.12524 2.25C7.7821 2.25 9.12524 3.59315 9.12524 5.25C9.12524 6.90685 7.7821 8.25 6.12524 8.25C4.46839 8.25 3.12524 6.90685 3.12524 5.25Z"
|
|
fill="black"
|
|
fillOpacity={1}
|
|
/>
|
|
<path
|
|
d="M9.87524 5.25C9.87524 3.59315 11.2184 2.25 12.8752 2.25C14.5321 2.25 15.8752 3.59315 15.8752 5.25C15.8752 6.90685 14.5321 8.25 12.8752 8.25C11.2184 8.25 9.87524 6.90685 9.87524 5.25Z"
|
|
fill="black"
|
|
fillOpacity={1}
|
|
/>
|
|
<path
|
|
d="M6.12504 9C8.72805 9 11.105 11.1426 11.3732 14.9473L11.4298 15.75H0.820312L0.876899 14.9473C1.14509 11.1426 3.52204 9 6.12504 9Z"
|
|
fill="black"
|
|
fillOpacity={1}
|
|
/>
|
|
<path
|
|
d="M18.1796 15.75H12.9333L12.8693 14.8418C12.7141 12.6398 11.9201 10.8076 10.7219 9.52435C11.3905 9.17864 12.1233 9 12.8749 9C15.4779 9 17.8548 11.1426 18.123 14.9473L18.1796 15.75Z"
|
|
fill="black"
|
|
fillOpacity={1}
|
|
/>
|
|
</g>
|
|
<defs>
|
|
<clipPath id="clip0_1299_2107">
|
|
<rect
|
|
width="18"
|
|
height="18"
|
|
fill="white"
|
|
fillOpacity={1}
|
|
transform="translate(0.5)"
|
|
/>
|
|
</clipPath>
|
|
</defs>
|
|
</svg>
|
|
<span className="text-sm">
|
|
{formatCompactNumber(discordWidget.presence_count)}
|
|
</span>
|
|
</div>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="absolute w-full bottom-0 left-0 flex justify-center">
|
|
<img
|
|
className="abs animate-float scale-[175%] md:scale-100"
|
|
src={CuteRobotFlyingPNG.src}
|
|
alt=""
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="hidden size-4/5 xl:size-3/5 bg-black rounded-[20px] mx-auto relative -mt-40 lg:flex p-3 animate-scale-in delay-300">
|
|
<div className="rounded-md size-full overflow-hidden">
|
|
<img
|
|
src={AppJanPNG.src}
|
|
alt="Jan App Interface"
|
|
className="w-full h-full object-fit"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="lg:hidden size-full bg-black rounded-2xl mx-auto relative mt-10 flex p-2 animate-scale-in delay-300">
|
|
<div className="rounded-lg size-full overflow-hidden">
|
|
<img
|
|
src={AppJanPNG.src}
|
|
alt="Jan App Interface"
|
|
className="w-full h-full object-fit"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Statistic and social */}
|
|
<section className="pt-20">
|
|
<div className="container mx-auto">
|
|
<h2 className="text-[24px] lg:text-[52px] font-semibold text-center mb-16 -tracking-[1.3px]">
|
|
Over 4 million downloads
|
|
</h2>
|
|
</div>
|
|
<TweetSection />
|
|
</section>
|
|
|
|
{/* Social tech */}
|
|
<section className="px-3 mt-20">
|
|
<div className="bg-[#C6E09E] px-4 relative py-10 h-[640px] sm:h-[800px] lg:h-[900px] 2xl:h-[1040px] rounded-2xl overflow-hidden">
|
|
<div className="container mx-auto relative z-10">
|
|
<div className="md:mt-10">
|
|
<div className="lg:w-3/5 mx-auto">
|
|
<div className="relative text-center md:text-left">
|
|
<h1
|
|
className="text-4xl lg:text-[50px] font-semibold -tracking-[1.3px] animate-on-scroll leading-tight"
|
|
data-delay="200"
|
|
>
|
|
Towards Open Superintelligence
|
|
</h1>
|
|
<p
|
|
className="-tracking-[0.6px] mt-4 text-xl text-neutral-700 animate-on-scroll lg:max-w-[512px]"
|
|
data-delay="400"
|
|
>
|
|
Jan takes the best of open source AI and packages it into an
|
|
easy-to-use product.
|
|
</p>
|
|
</div>
|
|
<div
|
|
className="mt-8 flex flex-col md:flex-row gap-4 animate-on-scroll"
|
|
data-delay="600"
|
|
>
|
|
<a
|
|
href="https://github.com/menloresearch/jan"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="bg-[#2C2C2C] py-2 hover:bg-[#1a1a1a] text-white h-18 pl-2 justify-start w-full md:w-60 transition-colors duration-200"
|
|
size="xxl"
|
|
>
|
|
<span className="bg-white text-black flex items-center justify-center w-14 h-14 rounded-lg mr-2">
|
|
<FaGithub className="size-8" />
|
|
</span>
|
|
<span className="flex items-start flex-col">
|
|
<span className="font-bold text-lg">Github</span>
|
|
<span className="text-sm mt-1">
|
|
{formatCompactNumber(stars)} stars
|
|
</span>
|
|
</span>
|
|
</Button>
|
|
</a>
|
|
<a
|
|
href="https://discord.com/invite/FTk2MvZwJH"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="bg-[#5765F2] py-2 border-2 hover:bg-[#5765F2] text-white h-18 pl-2 justify-start w-full md:w-60 transition-colors duration-200"
|
|
size="xxl"
|
|
>
|
|
<span className="bg-white text-black flex items-center justify-center w-14 h-14 rounded-lg mr-2">
|
|
<FaDiscord className="size-8 text-[#5765F2]" />
|
|
</span>
|
|
<span className="flex items-start flex-col">
|
|
<span className="font-bold text-lg">Discord</span>
|
|
<span className="text-sm mt-1">
|
|
{formatCompactNumber(discordWidget.presence_count)}{' '}
|
|
Online
|
|
</span>
|
|
</span>
|
|
</Button>
|
|
</a>
|
|
<a
|
|
href="https://huggingface.co/janhq"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="bg-[#FFD21E] py-2 border-2 hover:bg-[#e6bd1b] text-black h-18 pl-2 justify-start w-full md:w-60 transition-colors duration-200"
|
|
size="xxl"
|
|
>
|
|
<span className="bg-white text-black flex items-center justify-center w-14 h-14 rounded-lg mr-2">
|
|
<img
|
|
src={HuggingFaceSVG.src}
|
|
alt="Hugging Face"
|
|
className="size-8"
|
|
/>
|
|
</span>
|
|
<span className="flex items-start flex-col">
|
|
<span className="font-bold text-lg">HuggingFace</span>
|
|
<span className="text-sm mt-1">71 models</span>
|
|
</span>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="absolute w-full bottom-0 left-0 flex justify-center">
|
|
<img
|
|
className="animate-on-scroll"
|
|
data-delay="800"
|
|
src={CuteRobotBgMountainPNG.src}
|
|
alt=""
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Favorite Models Section */}
|
|
<FavoriteModels />
|
|
|
|
{/* Developer Community */}
|
|
<section className="px-3 pt-3">
|
|
<div className="bg-[#93B3EF] lg:h-[1000px] relative pb-16 pt-8 md:pt-16 rounded-2xl overflow-hidden">
|
|
<div className="container mx-auto relative z-10">
|
|
<div className="text-center text-black my-12 mt-10">
|
|
<h2
|
|
className="-tracking-[1.3px] text-4xl lg:text-[52px] font-bold mb-4 leading-normal animate-on-scroll"
|
|
data-delay="200"
|
|
>
|
|
Built in Public
|
|
</h2>
|
|
<p
|
|
className="text-[24px] -tracking-[0.6px] max-w-2xl mx-auto animate-on-scroll text-black/70 font-medium"
|
|
data-delay="400"
|
|
>
|
|
Our core team believes that AI should be open,{' '}
|
|
<br className="hidden md:block" /> and Jan is built in public.
|
|
</p>
|
|
</div>
|
|
<div className="max-w-4xl mx-auto px-4">
|
|
<div
|
|
className="bg-white rounded-lg shadow-[0px_4px_0px_0px_rgba(0,0,0,1)] border border-black animate-on-scroll-scale"
|
|
data-delay="600"
|
|
>
|
|
<div className="p-6 space-y-6">
|
|
<div className="flex flex-col items-start gap-4 border-b border-neutral-400 pb-4">
|
|
<div className="flex justify-between w-full">
|
|
<div className="w-8 h-8 rounded flex items-center justify-center flex-shrink-0">
|
|
<span className="text-white text-sm">
|
|
<img src={CodeSVG.src} alt="" />
|
|
</span>
|
|
</div>
|
|
<a
|
|
className="hidden md:block"
|
|
href="https://github.com/menloresearch/jan"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="!rounded-lg border-2 h-[40px]"
|
|
>
|
|
<span>
|
|
<FaGithub className="size-4" />
|
|
</span>
|
|
<span className="text-base">Go to GitHub</span>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
<div className="flex-1">
|
|
<div className="flex items-center justify-between mb-1">
|
|
<h3 className="font-semibold text-gray-900 text-[28px] -tracking-[0.7px]">
|
|
Develop
|
|
</h3>
|
|
</div>
|
|
<p className="text-gray-500 font-medium text-lg -tracking-[0.6px]">
|
|
Submit PRs for UI, tooling, or edge optimizations.
|
|
</p>
|
|
<a
|
|
className="md:hidden mt-4 block w-full"
|
|
href="https://github.com/menloresearch/jan"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="!rounded-lg border-2 h-[40px] w-full"
|
|
>
|
|
<span>
|
|
<FaGithub className="size-6" />
|
|
</span>
|
|
<span className="text-base">Go to GitHub</span>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col items-start gap-4 border-b border-neutral-400 pb-4">
|
|
<div className="flex justify-between w-full">
|
|
<div className="w-8 h-8 rounded flex items-center justify-center flex-shrink-0">
|
|
<span className="text-white text-sm">
|
|
<img src={ShareSVG.src} alt="" />
|
|
</span>
|
|
</div>
|
|
<a
|
|
className="hidden md:block"
|
|
href="https://discord.com/invite/FTk2MvZwJH"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="!rounded-lg border-2 h-[40px]"
|
|
>
|
|
<span>
|
|
<FaDiscord className="size-4 text-[#5765F2]" />
|
|
</span>
|
|
<span className="text-base">Join Community</span>
|
|
<div className="flex items-center gap-1 ml-3">
|
|
<IoMdPeople className="size-5" />
|
|
<span className="text-sm">
|
|
{formatCompactNumber(
|
|
discordWidget.presence_count
|
|
)}
|
|
</span>
|
|
</div>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
<div className="flex-1">
|
|
<div className="flex items-center justify-between mb-1">
|
|
<h3 className="font-semibold text-gray-900 text-[28px] -tracking-[0.7px]">
|
|
Share
|
|
</h3>
|
|
</div>
|
|
<p className="text-gray-500 font-medium text-lg -tracking-[0.6px]">
|
|
Spread the word, write tutorials, host meet-ups, post
|
|
videos.
|
|
</p>
|
|
<a
|
|
className="md:hidden block mt-4 w-full"
|
|
href="https://discord.com/invite/FTk2MvZwJH"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="!rounded-lg w-full border-2 h-[40px]"
|
|
>
|
|
<span>
|
|
<FaDiscord className="size-6 text-[#5765F2]" />
|
|
</span>
|
|
<span className="text-base">Join Community</span>
|
|
<div className="flex items-center gap-1 ml-3">
|
|
<IoMdPeople className="size-5" />
|
|
<span className="text-sm">
|
|
{formatCompactNumber(
|
|
discordWidget.presence_count
|
|
)}
|
|
</span>
|
|
</div>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col items-start gap-4 pb-4">
|
|
<div className="flex justify-between w-full">
|
|
<div className="w-8 h-8 rounded flex items-center justify-center flex-shrink-0">
|
|
<span className="text-white text-sm">
|
|
<img src={RobotSVG.src} alt="" />
|
|
</span>
|
|
</div>
|
|
<a
|
|
className="hidden md:block"
|
|
href="https://huggingface.co/janhq"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="!rounded-lg border-2 h-[40px]"
|
|
>
|
|
<span>
|
|
<img
|
|
src={HuggingFaceSVG.src}
|
|
alt="Hugging Face"
|
|
className="size-4"
|
|
/>
|
|
</span>
|
|
<span className="text-base">Check HuggingFace</span>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
<div className="flex-1">
|
|
<div className="flex items-center justify-between mb-1">
|
|
<h3 className="font-semibold text-gray-900 text-[28px] -tracking-[0.7px]">
|
|
Train
|
|
</h3>
|
|
</div>
|
|
<p className="text-gray-500 font-medium text-lg -tracking-[0.6px]">
|
|
Add evals, safety tests, or training recipes.
|
|
</p>
|
|
<a
|
|
className="md:hidden block mt-4 w-full"
|
|
href="https://huggingface.co/janhq"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<Button
|
|
variant="playful"
|
|
className="!rounded-lg border-2 h-[40px] w-full"
|
|
>
|
|
<span>
|
|
<img
|
|
src={HuggingFaceSVG.src}
|
|
alt="Hugging Face"
|
|
className="size-6"
|
|
/>
|
|
</span>
|
|
<span className="text-base">Check HuggingFace</span>
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="absolute w-full bottom-0 flex justify-center">
|
|
<img
|
|
className="abs animate-on-scroll"
|
|
data-speed="0.5"
|
|
data-delay="800"
|
|
src={CuteBuildingRobotPNG.src}
|
|
alt=""
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Call to action */}
|
|
<section className="px-3 pt-3">
|
|
<div className="bg-[#458edf] relative py-10 h-[480px] lg:h-[650px] rounded-2xl overflow-hidden">
|
|
<div className="w-full lg:w-3/5 mx-auto">
|
|
<div className="container relative z-10">
|
|
<div className="mt-10 flex flex-col lg:flex-row justify-between items-center gap-8">
|
|
<div className="relative animate-on-scroll" data-delay="200">
|
|
<h1 className="text-4xl text-center lg:text-left lg:text-[64px] mx-auto font-semibold -tracking-[1.6px] text-white">
|
|
Ask Jan,
|
|
<br />
|
|
<br />
|
|
get things done
|
|
</h1>
|
|
</div>
|
|
<div
|
|
className="bg-white flex flex-col p-0.5 rounded-2xl pb-2 shadow-[0px_4px_0px_0px_rgba(0,0,0,1)] border-2 border-black relative animate-on-scroll-scale"
|
|
data-delay="400"
|
|
>
|
|
<DropdownButton
|
|
size="xl"
|
|
className="w-full lg:w-auto"
|
|
classNameButton="!shadow-none border-2"
|
|
/>
|
|
<span className="text-xs font-medium text-center mt-2">
|
|
+{totalDownload(release)} downloads, Free & Open source
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="absolute w-full lg:-bottom-30 bottom-0 flex justify-center">
|
|
<img
|
|
className="abs animate-float parallax-element scale-[175%] md:scale-100"
|
|
data-speed="0.3"
|
|
src={CuteRobotFlyingPNG.src}
|
|
alt=""
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* <BuiltWithLove /> */}
|
|
{/* <Feature /> */}
|
|
{/* <APIStructure /> */}
|
|
{/* <Customizable /> */}
|
|
{/* <WallOfLove /> */}
|
|
{/* <Principles /> */}
|
|
{/* <CTANewsletter /> */}
|
|
{/* <Statistic /> */}
|
|
{/* <CTADownload /> */}
|
|
</Fragment>
|
|
)
|
|
}
|
|
|
|
export default Home
|