Skip to content

Commit 30349a1

Browse files
ottovwottovw
committed
initial commit
0 parents  commit 30349a1

31 files changed

+8247
-0
lines changed

‎.env

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
foo=bar

‎.gitignore

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
27+
# local env files
28+
.env.local
29+
.env.development.local
30+
.env.test.local
31+
.env.production.local
32+
33+
# vercel
34+
.vercel
35+
36+
# vscode
37+
/.vscode/

‎LICENSE

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
(The MIT License)
2+
3+
Copyright (c) 2020 Otto von Wesendonk and Contributors.
4+
5+
Permission is hereby granted, free of charge, to any person obtaining
6+
a copy of this software and associated documentation files (the
7+
'Software'), to deal in the Software without restriction, including
8+
without limitation the rights to use, copy, modify, merge, publish,
9+
distribute, sublicense, and/or sell copies of the Software, and to
10+
permit persons to whom the Software is furnished to do so, subject to
11+
the following conditions:
12+
13+
The above copyright notice and this permission notice shall be
14+
included in all copies or substantial portions of the Software.
15+
16+
THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
17+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
19+
IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
20+
CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
21+
TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
22+
SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

‎README.md

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
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).
2+
3+
## Getting Started
4+
5+
First, run the development server:
6+
7+
```bash
8+
npm run dev
9+
# or
10+
yarn dev
11+
```
12+
13+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
14+
15+
You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
16+
17+
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
18+
19+
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
20+
21+
## Learn More
22+
23+
To learn more about Next.js, take a look at the following resources:
24+
25+
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
26+
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
27+
28+
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
29+
30+
## Deploy on Vercel
31+
32+
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/import?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
33+
34+
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

‎components/DefaultLayout.js

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { Footer } from "./Footer"
2+
import { Header } from "./Header"
3+
import Head from 'next/head'
4+
5+
const DefaultLayout = ({ children }) => (
6+
<>
7+
<Head>
8+
<title>Next Example Blog</title>
9+
<link rel="icon" href="/favicon.ico" />
10+
</Head>
11+
<div className="flex flex-col min-h-screen">
12+
13+
<Header></Header>
14+
<main className="flex-grow container max-w-6xl mx-auto">{children}</main>
15+
<Footer></Footer>
16+
</div>
17+
</>
18+
)
19+
20+
export const getLayout = page => <DefaultLayout>{page}</DefaultLayout>
21+
22+
export default DefaultLayout

‎components/Footer.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export const Footer = ({ children }) => (
2+
<footer className="flex-shrink-0 h-10 bg-grey">
3+
<div className="container max-w-6xl mx-auto">This is the footer</div>
4+
</footer>
5+
)

‎components/FullArticle.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
export const FullArticle = ({ article }) => {
2+
return (
3+
<div className="prose">
4+
<h2>{article.title}</h2>
5+
<p>{article.excerpt}</p>
6+
<img src={article.mainImage} />
7+
<div>{article.body}</div>
8+
</div>
9+
)
10+
}

‎components/Header.js

+48
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import Logo from './assets/vercel.svg'
2+
import Link from 'next/link'
3+
4+
5+
export const Header = ({ children }) => (
6+
<nav className="bg-green-700">
7+
<div className="h-20 max-w-6xl mx-auto">
8+
<div className="flex items-center justify-between flex-wrap p-6 px-0">
9+
{/* Logo */}
10+
<div className="flex items-center flex-no-shrink mr-6">
11+
<Link href="/">
12+
<Logo fill="white"></Logo>
13+
</Link>
14+
</div>
15+
16+
{/* Menu Button */}
17+
<div className="block lg:hidden">
18+
<button className="flex items-center px-3 py-2 border rounded text-teal-lighter border-teal-light hover:text-white hover:border-white">
19+
<svg className="h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><title>Menu</title><path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" /></svg>
20+
</button>
21+
</div>
22+
23+
{/* Elements */}
24+
<div className="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
25+
<div className="text-sm lg:flex-grow">
26+
27+
<Link href="/">
28+
<a className="block mt-4 lg:inline-block lg:mt-0 text-white hover:text-red-500 mr-4">
29+
HomePage
30+
</a>
31+
</Link>
32+
<Link href="/test-page">
33+
<a className="block mt-4 lg:inline-block lg:mt-0 text-white hover:text-red-500 mr-4">
34+
Test
35+
</a>
36+
</Link>
37+
<Link href="/long-text">
38+
<a className="block mt-4 lg:inline-block lg:mt-0 text-white hover:text-red-500 mr-4">
39+
Long Text
40+
</a>
41+
</Link>
42+
43+
</div>
44+
</div>
45+
</div>
46+
</div>
47+
</nav >
48+
)

‎components/ShortArticle.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export const ShortArticle = ({ article }) => {
2+
return (
3+
<div className="prose">
4+
<h2>{article.title}</h2>
5+
<p>{article.excerpt}</p>
6+
</div>
7+
)
8+
}

‎components/assets/vercel.svg

+4
Loading

‎lib/cotUtil.js

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import confetti from 'canvas-confetti'
2+
3+
var colors = ['#bb0000', '#ffffff']
4+
5+
const startFrame = (cb) => {
6+
var end = Date.now() + (7 * 1000);
7+
const frame = () => {
8+
confetti({
9+
particleCount: 2,
10+
angle: 60,
11+
spread: 55,
12+
origin: { x: 0 },
13+
colors: colors
14+
});
15+
confetti({
16+
particleCount: 2,
17+
angle: 120,
18+
spread: 55,
19+
origin: { x: 1 },
20+
colors: colors
21+
});
22+
23+
if (Date.now() < end) {
24+
requestAnimationFrame(frame);
25+
} else {
26+
cb()
27+
}
28+
}
29+
frame()
30+
}
31+
32+
const listener = () => {
33+
if (typeof document === 'undefined') {
34+
return
35+
}
36+
37+
let isRunning = false
38+
39+
document.addEventListener('keydown', function (event) {
40+
if (isRunning) {
41+
return;
42+
}
43+
// ALT + O combo
44+
if (event.altKey && event.key === 'o') {
45+
isRunning = true
46+
startFrame(() => {
47+
isRunning = false
48+
return isRunning
49+
})
50+
}
51+
});
52+
}
53+
54+
export default listener()

‎lib/data/articles.js

+93
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
export const getArticles = async () => {
2+
return articleMocks()
3+
}
4+
5+
const articleMocks = () => {
6+
return [
7+
{
8+
id: 1,
9+
_v: 1,
10+
placeId: 1,
11+
defaultLocale: "en",
12+
slug: "my-super-article",
13+
title: "My Super Article",
14+
mainImage: "https://picsum.photos/400/200",
15+
excerpt: "Lorem Ipsum has been the industry's standard dummy text.",
16+
body: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
17+
authorId: 1,
18+
authorName: "John Doe",
19+
publicationDate: "2021-01-01"
20+
},
21+
{
22+
id: 2,
23+
_v: 1,
24+
placeId: 1,
25+
defaultLocale: "en",
26+
slug: "new-year-is-there",
27+
title: "New Year is there!",
28+
mainImage: "https://picsum.photos/400/200",
29+
excerpt: "Lorem Ipsum has been the industry's standard dummy text.",
30+
body: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
31+
authorId: 1,
32+
authorName: "John Doe",
33+
publicationDate: "2021-01-01"
34+
},
35+
{
36+
id: 3,
37+
_v: 1,
38+
placeId: 1,
39+
defaultLocale: "en",
40+
slug: "all-you-want-to-know-about-x",
41+
title: "All you want to know about X",
42+
mainImage: "https://picsum.photos/400/200",
43+
excerpt: "Lorem Ipsum has been the industry's standard dummy text.",
44+
body: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
45+
authorId: 1,
46+
authorName: "John Doe",
47+
publicationDate: "2021-01-01"
48+
},
49+
{
50+
id: 4,
51+
_v: 1,
52+
placeId: 2,
53+
defaultLocale: "en",
54+
slug: "he-is-gone-wooohoo",
55+
title: "He is gone, wooohoo!",
56+
mainImage: "https://picsum.photos/400/200",
57+
excerpt: "Lorem Ipsum has been the industry's standard dummy text.",
58+
body: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
59+
authorId: 1,
60+
authorName: "John Doe",
61+
publicationDate: "2021-01-01"
62+
},
63+
{
64+
id: 5,
65+
_v: 1,
66+
placeId: 2,
67+
defaultLocale: "en",
68+
slug: "super-cool-stuff-here",
69+
title: "Super cool stuff here",
70+
mainImage: "https://picsum.photos/400/200",
71+
excerpt: "Lorem Ipsum has been the industry's standard dummy text.",
72+
body: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
73+
authorId: 1,
74+
authorName: "John Doe",
75+
publicationDate: "2021-01-01"
76+
},
77+
{
78+
id: 6,
79+
_v: 1,
80+
placeId: 2,
81+
defaultLocale: "en",
82+
slug: "did-you-know-that",
83+
title: "Did you know that?",
84+
mainImage: "https://picsum.photos/400/200",
85+
excerpt: "Lorem Ipsum has been the industry's standard dummy text.",
86+
body: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.",
87+
authorId: 1,
88+
authorName: "John Doe",
89+
publicationDate: "2021-01-01"
90+
},
91+
]
92+
}
93+

‎lib/i18n.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import i18n from 'i18next';
2+
import { initReactI18next, useTranslation as useTranslationNext } from 'react-i18next';
3+
import { resources } from '../locales'
4+
5+
// todo evaluate http backend
6+
// current i18next for next is not integreated with next router functionality
7+
8+
i18n
9+
.use(initReactI18next)
10+
.init({
11+
fallbackLng: 'en',
12+
lng: 'en',
13+
defaultNS: 'homepage',
14+
debug: false, // TODO config
15+
interpolation: {
16+
escapeValue: false,
17+
},
18+
resources
19+
})
20+
21+
export const useTranslation = (locale, ns = 'common') => {
22+
const { t, i18n } = useTranslationNext(ns)
23+
if (i18n.language != locale) {
24+
i18n.changeLanguage(locale)
25+
}
26+
return t
27+
}
28+
29+
export default i18n

0 commit comments

Comments
 (0)