6 ha cambiato i file con 43 aggiunte e 2 eliminazioni
-
BINpublic/photo.png
-
+4 -0src/Person.ts
-
+15 -0src/app/components/AboutBrief.tsx
-
+14 -0src/app/components/PersonContext.tsx
-
+7 -2src/app/layout.tsx
-
+3 -0src/app/page.tsx
BIN
public/photo.png
Vedi File
| Prima | Dopo |
|---|---|
|
|
| Larghezza: 290 | Altezza: 290 | Dimensione: 14 KiB |
+ 4
- 0
src/Person.ts
Vedi File
| @@ -0,0 +1,4 @@ | |||||
| export const Person = { | |||||
| name: "David Hrdina Němeček", | |||||
| brief: "Software developer, people manager." | |||||
| }; | |||||
+ 15
- 0
src/app/components/AboutBrief.tsx
Vedi File
| @@ -0,0 +1,15 @@ | |||||
| import React, { useContext } from 'react'; | |||||
| import Container from 'react-bootstrap/Container'; | |||||
| import Image from 'react-bootstrap/Image' | |||||
| import { PersonContext } from './PersonContext'; | |||||
| export default function AboutBrief() { | |||||
| const person = useContext(PersonContext) | |||||
| return ( | |||||
| <Container className='about-brief'> | |||||
| <Image alt='Photograph of the person' rounded={true} src='photo.png'></Image> | |||||
| <h1>{person.name}</h1> | |||||
| <p className='brief'>{person.brief}</p> | |||||
| </Container> | |||||
| ) | |||||
| } | |||||
+ 14
- 0
src/app/components/PersonContext.tsx
Vedi File
| @@ -0,0 +1,14 @@ | |||||
| 'use client' | |||||
| import React from 'react'; | |||||
| import { createContext } from 'react'; | |||||
| import { Person } from '../../Person'; | |||||
| export const PersonContext = createContext(Person); | |||||
| export function PersonProvider({ children }) { | |||||
| return ( | |||||
| <PersonContext.Provider value={Person}> | |||||
| {children} | |||||
| </PersonContext.Provider> | |||||
| ) | |||||
| } | |||||
+ 7
- 2
src/app/layout.tsx
Vedi File
| @@ -2,11 +2,12 @@ import React from 'react' | |||||
| import { Inter } from 'next/font/google' | import { Inter } from 'next/font/google' | ||||
| import './globals.css' | import './globals.css' | ||||
| import { PersonProvider } from './components/PersonContext' | |||||
| const inter = Inter({ subsets: ['latin'] }) | const inter = Inter({ subsets: ['latin'] }) | ||||
| export const metadata = { | export const metadata = { | ||||
| title: 'David Hrdina Němeček | CV', | |||||
| title: 'David Hrdina Němeček | CV.', | |||||
| description: 'Curriculum Vitae', | description: 'Curriculum Vitae', | ||||
| } | } | ||||
| @@ -17,7 +18,11 @@ export default function RootLayout({ | |||||
| }) { | }) { | ||||
| return ( | return ( | ||||
| <html lang="en"> | <html lang="en"> | ||||
| <body className={inter.className}>{children}</body> | |||||
| <body className={inter.className}> | |||||
| <PersonProvider> | |||||
| {children} | |||||
| </PersonProvider> | |||||
| </body> | |||||
| </html> | </html> | ||||
| ) | ) | ||||
| } | } | ||||
+ 3
- 0
src/app/page.tsx
Vedi File
| @@ -2,10 +2,13 @@ | |||||
| import React from 'react'; | import React from 'react'; | ||||
| import Container from 'react-bootstrap/Container'; | import Container from 'react-bootstrap/Container'; | ||||
| import JobsHistory from './components/JobsHistory'; | import JobsHistory from './components/JobsHistory'; | ||||
| import AboutBrief from './components/AboutBrief'; | |||||
| export default function Home() { | export default function Home() { | ||||
| return ( | return ( | ||||
| <Container fluid='xxl'> | <Container fluid='xxl'> | ||||
| <AboutBrief></AboutBrief> | |||||
| <JobsHistory></JobsHistory> | <JobsHistory></JobsHistory> | ||||
| </Container> | </Container> | ||||
| ) | ) | ||||