![Zepeto of junhoyeo](/junhoyeo/trendy-resume/raw/main/docs/assets/profile.png)
Hello, this is my trendy new rรฉsumรฉ. Wanna make one for yourself too?
If any of you are here for my latest(or English) rรฉsumรฉ, please leave an issue here or contact me for updates,
since I don't have much time to keep track of my works nowadays. ๐
Add yours too! ๐ฅฐ
- trendy-resume.now.sh
- kdw.now.sh
- seungmin.io
- about.mingeun.com (inspired from design)
You can just clone this repo to your account, or use this repo as a template!
git clone https://github.com/your-nickname/some-repository.git
# this clone link is from the repo that you generated at the previous step!
cd some-repository
# move to your newly cloned folder
yarn
# to install dependencies
# of course, you can use npm
# - but just be sure to delete yarn.lock because it'll be useless if then
yarn dev
# run the dev server in your local
โ ๏ธ This project uses Next.js for server-side rendering!!!โ ๏ธ Keep this in mind while developing features related to paging, rendering, generating values etc. ๐
You can deploy to services that supports Next.js like ZEIT, Github Pages, Heroku.
Now, look through the files and feel free to customize for yourself! ๐ฅ
I'm still working on a more proper documentation and make more things customizable, so you can either wait, hack, or help me by contributing via Issues and Pull Requests!
{
"title": "Rรฉsumรฉ",
"author": "junhoyeo",
"catchphrase": {
"text": "Frontend is \nINEVITABLEโข",
"description": [
"๋ถ๊ฐ๋ฅํ ํ๋ก ํธ์๋๋ ์๋ค๊ณ ๋ฏฟ์ต๋๋ค.",
"๊ทธ๋ ๊ธฐ ๋๋ฌธ์ ์ค๋๋ ์ฑ์ฅํ๊ธฐ ์ํ ๋
ธ๋ ฅ์ ํ๊ณ ์์ฃ ."
]
}
}
Name | Description | Location |
---|---|---|
Config | The JSON config file | src/data/info.json |
Type | Typing of object | src/utils/types.ts (interface IInfo ) |
Field | Description | Example |
---|---|---|
title |
Title | Rรฉsumรฉ |
author |
Author name next to title | junhoyeo |
catchphrase.text |
Main Catchphrase | Frontend is \nINEVITABLEโข |
catchphrase.description |
Description below main catchphrase(rendered line by line) | ["๋ถ๊ฐ๋ฅํ ํ๋ก ํธ์๋๋ ์๋ค๊ณ ๋ฏฟ์ต๋๋ค.", "๊ทธ๋ ๊ธฐ ๋๋ฌธ์ ์ค๋๋ ์ฑ์ฅํ๊ธฐ ์ํ ๋
ธ๋ ฅ์ ํ๊ณ ์์ฃ ."] |
See above for preview.
[
{
"name": "github",
"icon": "fab fa-github",
"href": "https://github.com/junhoyeo"
},
{
"name": "facebook",
"icon": "fab fa-facebook",
"href": "https://www.facebook.com/juno3704"
}
]
Name | Description | Location |
---|---|---|
Config | The JSON config file that contains list of objects | src/data/social.json |
Type | Typing of a single object | src/utils/types.ts (interface ILink ) |
Field | Description | Example |
---|---|---|
name |
Name of the navigation | github |
icon |
Icon className from Font Awesome | fab fa-github |
href |
Location to move when link is clicked | https://github.com/junhoyeo |
See above for preview.
[
{
"name": "ํ",
"href": "#"
},
{
"name": "๊ฐ๋ฐ ์คํ",
"href": "#stacks"
},
{
"name": "์ต๊ทผ ํ๋ก์ ํธ",
"href": "#recent"
},
{
"name": "๋ธ๋ก๊ทธ ์ดํด๋ณด๊ธฐ",
"href": "#blog"
}
]
Name | Description | Location |
---|---|---|
Config | The JSON config file that contains list of objects | src/data/navigations.json |
Type | Typing of a single object | src/utils/types.ts (interface INavigation ) |
Field | Description | Example |
---|---|---|
name |
Name of the navigation | Home , My Stacks , Recent |
href |
Location to move after navigation item is clicked(usually bookmarks with id ) |
#home , #stacks , #recent |
See above for preview.
[
{
"image": "coffee.png"
},
{
"image": "default.png"
},
{
"image": "poze.png",
"contain": true
}
]
Name | Description | Location |
---|---|---|
Config | The JSON config file that contains list of objects | src/data/avatar.json |
Type | Typing of a single object | src/utils/types.ts (interface IAvatar ) |
Field | Description | Required |
---|---|---|
image |
File name of the avatar file, located in the public/static/avatar folder | true |
contain |
object-fit will be contain in the rendered img tag if this field is true (else cover ) |
false |
[
{
"name": "React & React Native",
"image": "react.png",
"skill": 90,
"color": "#52C1DE",
"description": "์์ด๋์ด๊ฐ ๋ ์ค๋ฅด๋ฉด ๋ฐ๋ก ๊ตฌํํด ๋ผ ์ ์์ต๋๋ค. Hooks๋ฅผ ์ฌ์ฉํด์ ๊น๋ํ ์ฝ๋๋ฅผ (๋ณดํต ํ์
์คํฌ๋ฆฝํธ๋ก) ์์ฑํฉ๋๋ค."
}
]
Name | Description | Location |
---|---|---|
Config | The JSON config file that contains list of objects | src/data/stacks.json |
Type | Typing of a single object | src/utils/types.ts (interface IStack ) |
Field | Description | Required |
---|---|---|
name |
Name of stack | true |
image |
file name of the stack image(logo) file, located in the public/static/stacks folder | true |
skill |
Skill proficiency expressed in percentiles(0 to 100 ) |
true |
color |
Brand color for stack(used in image shadow & progress bar color) | true |
description |
Description under stack name | true |
[
{
"image": "static/products/danim.png",
"title": "์ธ์์ ๊ฑฐ๋๋ค, ๋ค๋.",
"parts": [
"APP",
"DESIGN"
],
"category": "์ ํ๋ฆฌ์ผ์ด์
",
"place": "์ 19ํ ์ฑ์ผ - ์ํ ๋ถ๋ฌธ ์ต์ฐ์์(1์)",
"date": "2019.12.21 ~ 2019.12.22",
"description": "์ค์ค๋ก ๋๋ ์์คํ ์ฌ๋์๊ฒ, ํน๋ณํ ์ฌํ์ ์ ๋ฌผํ ์ ์๋๋ก ๋์์ฃผ๋ ์ฑ์
๋๋ค. ๋ง์ถคํ ์ฌํ ์ํ์ ์ ๊ณตํ๊ณ ์ ๋ฌผํ ์ ์๊ฒ ํฉ๋๋ค. ์ธ์ฑ UI๋ฅผ ๋์์ธํ ๋ค React Native๋ฅผ ์ด์ฉํด ๋ชจ๋ฐ์ผ ์ฑ์ ์ ์ํ๋ ๊ฒ์ ๋ด๋นํ์ต๋๋ค.",
"links": [
{
"icon": "fab fa-github",
"text": "๋ชจ๋ฐ์ผ ์ฑ ์ฝ๋ ๋ณด๊ธฐ",
"href": "https://github.com/junhoyeo"
},
{
"icon": "fab fa-github",
"text": "๋ฐฑ์๋ ์ฝ๋ ๋ณด๊ธฐ",
"href": "https://github.com/junhoyeo"
}
]
}
]
Name | Description | Location |
---|---|---|
Config | The JSON config file that contains list of objects | src/data/products.json |
Type | Typing of a single object | src/utils/types.ts (interface IProduct ) |
Field | Description | Required |
---|---|---|
image |
file name of the product image file, located in the public/static/products folder | true |
title |
Product title | true |
parts |
Array of string parts(tags in top left to express responsibilities) | false |
place |
Place of competition and award performance | false |
date |
Development Period | false |
description |
Product description(visible when card is clicked) | false |
links |
Array of product links with interface ILink (visible when card is clicked) |
false |
For blog posts(2nd section). All models/fields are same as products.
Name | Description | Location |
---|---|---|
Config | The JSON config file that contains list of objects | src/data/products.json |
Type | Typing of a single object | src/utils/types.ts (interface IProduct ) |
These are the materials I used for designing this blog.
Service or Material | Description | Alternatives |
---|---|---|
Zepeto | You can easily make a cool avatar like youself, and take pictures | Maybe some facial-emoji solutions? |
Smartmockups | Some of the mockups was generated here. It's really great but trial version like mine includes a small watermark in the corner, also it's hard to find multiple device mockups with the same machine. | Photoshop is the best, really. |
Feel free to add yours too!