💫
ddongule-simple-portfolio
db.json and some assets(images, markdowns) then it's all done!
💛
See Example!
👉
(ddongule's portfolio)
🌿
Features
-
🔥 One Page Layout -
🔥 Responsive Web -
🔥 Dark/Light Theme
🪜 How To Use
1. Clone this repository
$ git clone https://github.com/ddongule/ddongule-simple-portfolio
2. Go into the repository
$ cd ddongule-simple-portfolio
3. Install Dependencies and Start Development Server
-
Using NPM
$ npm install $ npm start -
Using Yarn
$ yarn $ yarn start
4.
🌎
Start Developing! Let's Go!
🚀
Quick Start
If you do not want to use any of the items below, feel free to delete it from
db.json! It will work fine!
-
example) You can choose sections that you want to use! Just delete it from
db.json-
src/db.json{ "aboutMe": { "name": "그루밍", "nickName": "nickName!", "profileImg": "../assets/images/me.gif", "email": "[email protected]", "githubUrl": "https://github.com/ddongule", "blogUrl": "https://mingule.tistory.com/", "linkedInUrl": "https://www.linkedin.com/" }, "timestamp": [ { "title": "우아한 횽제들", "when": "21.12 ~ ", "organizer": "우아한 횽제들", "tags": ["company"] } ] }
-
👉
1. Main Title Section.
-
Go to
/src/db.json"aboutMe": { ... "nickName": "type your own title!" ... }
👉
2. About Me Section.
-
Put your image to
/public/assets/imagesjpg,gif,png
-
Go to
/src/db.json"aboutMe": { ... "profileImg": "../assets/images/yourImageFileName" ... }
-
Change Introduction Text
-
Go to
/src/assets/static/markdown/aboutMySelf.mdWrite With Markdown! Then You'll See..
The Result will be like this!
-
h1, h2, h3
# h1 ## h2 ### h3 -
Bold text with Highlight
-
yellow
**Hi, my name is ddongule** -
red
+R+Hi, my name is ddongule+R+ -
blue
+B+Hi, my name is ddongule+B+ -
green
+G+Hi, my name is ddongule+G+
-
-
Enter
<br /> -
Code
`React.js` `HTML/CSS(SASS)` `Javascript` -
CheckList (Black & White)
& Check List(Black & White) -
CheckList (HighLight)
- Check List(Black & White) -
Ordered List
1. Ordered List 2. Ordered List 3. Ordered List 4. Ordered List
-
👉
3. Skill Sets Section.
Write down your Professional Skill Sets here!
✨ Customize your own SkillSets Section!
- Go to
/src/db.json
"skillSets": [
{
"category": "Front End Skills",
"skills": [
{ "skill": "Javascript", "level": "5" },
...
]
},
...
]
👉
4. Projects Section.
✨ Customize your own Projects Section!
- Go to
/src/db.json
"projects": [
{
"imgUrl": "/assets/images/exmaple.png",
"githubUrl": "https://github.com/ddongule",
"projectUrl": "www.ddongule.com",
"title": "ddongule-simple-portfolio",
"term": "21.02.02 v1.3.0",
"description": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime mollitia ..",
"attribution": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime mollitia ..",
"tags": [] // Even if there are no tags to write, you should leave the empty array as is.
},
...
]
👉
5. Timestamp Section.
✨ Customize your own Timestamp Section!
- Go to
/src/db.json
"timestamp": [
{
"title": "Woowa Sisters",
"when": "21.12 ~ ",
"organizer": "Woowa Sisters",
"tags": ["company"] // Even if there are no tags to write, you should leave the empty array as is.
},
...
]
👉
6. Experiences Section.
✨ Customize your own Experiences Section!
- Go to
/src/db.json
"experiences": [
{
"imgUrl": "/assets/images/exmaple.png",
"title": "[Software Engineer] Woowa Sisters Co.",
"term": "21.02 - 현재 진행 중",
"description": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime mollitia ..",
"experienceUrl": "https://woowacourse.github.io/"
},
...
]
👉
7. Education Section.
✨ Customize your own Education Section!
- Go to
/src/db.json
"educations": [
{
"title": "Woowa University",
"term": "2013.03 - 2017.03",
"description": "[Graduated] Computer Science and Engineering"
},
...
]
🐞
Bug Reporting
How to Contribute?
- Fork this repository
- Create your own branch:
git checkout -b new-feature - Add and Commit:
git commit -am 'feat: add new feature - Push to your branch:
git push origin new-feature - Submit a Pull Request!
🌟
