Skip to content

Commit 3c454cf

Browse files
committed
Add homepage
1 parent e1deb70 commit 3c454cf

File tree

1 file changed

+120
-0
lines changed

1 file changed

+120
-0
lines changed

src/pages/index.js

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
import { BigText, InlineCode, Paragraph, Widont } from '@/components/home/common'
2+
import { Footer } from '@/components/home/Footer'
3+
import { Hero } from '@/components/home/Hero'
4+
import { Logo } from '@/components/Logo'
5+
import { Search } from '@/components/Search'
6+
import { Testimonials } from '@/components/Testimonials'
7+
import Head from 'next/head'
8+
import NextLink from 'next/link'
9+
10+
export default function Home() {
11+
return (
12+
<div className="space-y-20 sm:space-y-32 md:space-y-40 lg:space-y-44 overflow-hidden">
13+
<Head>
14+
<meta
15+
key="twitter:title"
16+
name="twitter:title"
17+
content="Javaistic - Learn Java programming very fast and easily with Javaistic."
18+
/>
19+
<meta
20+
key="og:title"
21+
property="og:title"
22+
content="Javaistic - Learn Java programming very fast and easily with Javaistic."
23+
/>
24+
<title>Javaistic - Learn Java programming very fast and easily with Javaistic.</title>
25+
</Head>
26+
<header className="relative z-10 max-w-screen-lg xl:max-w-screen-xl mx-auto">
27+
<div className="px-4 sm:px-6 md:px-8 mb-14 sm:mb-20 xl:mb-8">
28+
<div className="border-b border-gray-200 py-4 flex items-center justify-between mb-16 sm:mb-20 sm:mx-0 sm:px-0">
29+
<div className="flex items-center">
30+
<NextLink href="/">
31+
<Logo className="w-auto flex h-8 lg:h-10 sm:h-5" />
32+
</NextLink>
33+
</div>
34+
<div className="flex items-center space-x-6 sm:space-x-10 ml-6 sm:ml-2">
35+
<Search />
36+
<NextLink href="/docs">
37+
<a className="text-base leading-6 font-medium hover:text-gray-600 transition-colors duration-200 py-2">
38+
<span className="sm:hidden">Docs</span>
39+
<span className="hidden sm:inline">Documentation</span>
40+
</a>
41+
</NextLink>
42+
<a
43+
href="https://github.com/javaistic/javaistic"
44+
className="text-gray-400 hover:text-gray-500 transition-colors duration-200"
45+
>
46+
<span className="sr-only">Javaistic on GitHub</span>
47+
<svg width="24" height="24" viewBox="0 0 16 16" fill="currentColor">
48+
<path
49+
fillRule="evenodd"
50+
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"
51+
/>
52+
</svg>
53+
</a>
54+
</div>
55+
</div>
56+
<h1 className="text-4xl sm:text-6xl lg:text-7xl leading-none font-extrabold tracking-tight text-gray-900 mt-16 mb-8 sm:mt-18 sm:mb-10">
57+
Learn{' '}
58+
<span className="font-extrabold text-transparent bg-clip-text bg-gradient-to-br from-green-400 to-cyan-500">
59+
Java
60+
</span>{' '}
61+
programming very fast and easily with{' '}
62+
<span className="font-extrabold text-transparent bg-clip-text bg-gradient-to-br from-sky-400 to-indigo-500">
63+
Javaistic.
64+
</span>
65+
</h1>
66+
<p className="max-w-screen-lg text-lg sm:text-2xl sm:leading-10 font-medium mb-10 sm:mb-11">
67+
An Java Programming learning website packed with information and programs ranging from{' '}
68+
<InlineCode>basics</InlineCode> , <InlineCode>arrays</InlineCode> ,{' '}
69+
<InlineCode>string programs</InlineCode> to <InlineCode>2D arrays</InlineCode> ,{' '}
70+
<InlineCode>recursion</InlineCode> , <InlineCode>matrices</InlineCode> and many more.
71+
</p>
72+
<div className="flex flex-wrap space-y-4 sm:space-y-0 sm:space-x-4 text-center mt-12 mb-28 ">
73+
<NextLink href="/docs">
74+
<a className="w-full sm:w-auto flex-none bg-blue-700 hover:bg-blue-600 text-white text-lg shadow-md leading-6 font-semibold py-3 px-6 border border-transparent rounded-xl focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-blue-600 focus:outline-none transition-colors duration-200">
75+
Get started
76+
</a>
77+
</NextLink>
78+
<NextLink href="/">
79+
<a className="w-full sm:w-auto flex-none bg-gray-900 hover:bg-gray-700 text-white text-lg shadow-md leading-6 font-semibold py-3 px-6 border border-transparent rounded-xl focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-gray-900 focus:outline-none transition-colors duration-200">
80+
Learn more
81+
</a>
82+
</NextLink>
83+
</div>
84+
</div>
85+
<Hero />
86+
</header>
87+
<section className="relative z-10 text-center max-w-screen-lg xl:max-w-screen-xl mx-auto">
88+
<div className="px-4 sm:px-6 md:px-8">
89+
<BigText as="h2" className="mb-8">
90+
<Widont>“ Learning By Doing ” actually works.</Widont>
91+
</BigText>
92+
<figure>
93+
<blockquote>
94+
<Paragraph className="max-w-4xl mx-auto mb-6">
95+
Let's us learn Java by learning concepts and practicing programs.<br/>{' '}
96+
<Widont>
97+
I am sure you will fall in love with Java.
98+
</Widont>
99+
</Paragraph>
100+
</blockquote>
101+
<figcaption className="sm:text-xl font-medium flex flex-col items-center">
102+
<div className="p-1 border-2 border-sky-400 rounded-full mb-3">
103+
<img
104+
src={require('@/img/uiuxarghya.png').default}
105+
alt=""
106+
className="w-10 h-10 rounded-full bg-sky-100"
107+
loading="lazy"
108+
/>
109+
</div>
110+
<div className="text-gray-900">Arghya Ghosh</div>
111+
<div className="text-sky-600">Creator of Javaistic</div>
112+
</figcaption>
113+
</figure>
114+
</div>
115+
</section>
116+
<Testimonials />
117+
<Footer />
118+
</div>
119+
)
120+
}

0 commit comments

Comments
 (0)