Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/imfunniee/gitfolio
:octocat: personal website + blog for every github user
https://github.com/imfunniee/gitfolio
awesome blog github node personal-website showcase theme
Last synced: 3 months ago
JSON representation
:octocat: personal website + blog for every github user
- Host: GitHub
- URL: https://github.com/imfunniee/gitfolio
- Owner: imfunniee
- License: gpl-3.0
- Archived: true
- Created: 2019-05-06T16:50:05.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-02-19T12:44:41.000Z (almost 3 years ago)
- Last Synced: 2024-09-21T19:32:36.686Z (3 months ago)
- Topics: awesome, blog, github, node, personal-website, showcase, theme
- Language: JavaScript
- Homepage: https://imfunniee.github.io/gitfolio/
- Size: 325 KB
- Stars: 6,421
- Watchers: 60
- Forks: 681
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- project-awesome - imfunniee/gitfolio - :octocat: personal website + blog for every github user (JavaScript)
README
### archived in favor of v2 release soon ;)
# Gitfolio
[![Tweet](https://img.shields.io/twitter/url/https/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=personal%20website%20and%20a%20blog%20for%20every%20github%20user%20@imfunnieee%20&url=https://github.com/imfunniee/gitfolio) ![GitHub release](https://img.shields.io/github/release/imfunniee/gitfolio.svg?style=popout-square) ![npm](https://img.shields.io/npm/dm/gitfolio.svg?style=popout-square) ![GitHub top language](https://img.shields.io/github/languages/top/imfunniee/gitfolio.svg?style=popout-square) ![GitHub last commit](https://img.shields.io/github/last-commit/imfunniee/gitfolio.svg?style=popout-square) ![GitHub](https://img.shields.io/github/license/imfunniee/gitfolio.svg?style=popout-square) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)### personal website + blog for every github user
Gitfolio will help you get started with a portfolio website where you could showcase your work + a blog that will help you spread your ideas into real world.
Check out this [live demo](https://imfunniee.github.io/gitfolio/) to see gitfolio in action.
# Getting Started
### Let's Install
Install gitfolio
```sh
npm i gitfolio -g
```### Let's Build
Using the UI
```sh
$ gitfolio ui
```> Tip: You can use ui to create new blogs and for updating your folio too.
or
```sh
gitfolio build
````` is your username on github. This will build your website using your GitHub username and put it in the `/dist` folder.
To run your website use `run` command, Default port is 3000
```sh
gitfolio run -p [port]
```🎉 Congrats, you just made yourself a personal website!
### Let's Customize
#### Forks
To include forks on your personal website just provide `-f` or `--fork` argument while building
```sh
$ gitfolio build -f
```#### Sorting Repos
To sort repos provide `--sort [sortBy]` argument while building. Where `[sortBy]` can be `star`, `created`, `updated`, `pushed`,`full_name`. Default: `created`
```sh
$ gitfolio build --sort star
```#### Ordering Repos
To order the sorted repos provide `--order [orderBy]` argument while building. Where `[orderBy]` can be `asc` or `desc`. Default: `asc`
```sh
$ gitfolio build --sort star --order desc
```#### Customize Themes
Themes are specified using the `--theme [theme-name]` flag when running the `build` command. The available themes are
- `light`
- `dark`> TODO: Add more themes
For example, the following command will build the website with the dark theme
```sh
$ gitfolio build --theme dark
```#### Customize background image
To customize the background image just provide `--background [url]` argument while building
```sh
$ gitfolio build --background https://images.unsplash.com/photo-1557277770-baf0ca74f908?w=1634
```You could also add in your custom CSS inside `index.css` to give it a more personal feel.
#### Add Social Media links on your profile
Twitter, LinkedIn, Medium & Dribbble links to your profile while building
```sh
gitfolio build --twitter --linkedin --medium --dribbble
```### Let's Publish
Head over to GitHub and create a new repository named `username.github.io`, where username is your username. Push the files inside`/dist` folder to repo you just created.
Go To `username.github.io` your site should be up!!
### Updating
To update your info, simply run
```sh
$ gitfolio update
```or use the `Update` options in gitfolio's UI
This will update your info and your repository info.
To Update background or theme you need to run `build` command again.
### Add a Blog
To add your first blog use the UI.
```sh
$ gitfolio ui
```This will open up a UI page and you can click on `New Blog` to create a new blog. Once you are done writing your blog you can hit the `Create Blog`.
This will create a blog inside `./dist/blog` folder.
Look for success or error in your terminal.
This also adds content to `blog.json` file. This file helps in showcasing your blogs on your personal website as [cards](https://imfunniee.github.io/gitfolio/#blog_section). You could customize the JSON object that corresponds your current blog.
Blog Demo? [here](https://imfunniee.github.io/gitfolio/blog/my-first-post/)
Blog's default JSON Format
```
{
"url_title": "my-first-blog", // the title you provide while creating a new blog, this appears in url
"title": "Lorem ipsum dolor sit amet", // main title of blog
"sub_title": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", // sub-title of blog
"top_image": "https://images.unsplash.com/photo-1553748024-d1b27fb3f960?w=1450", // main image of blog
"visible": true // don't worry about this
}
```### Follow me on twitter for more updates [@imfunnieee](https://twitter.com/imfunnieee)
### License
![GitHub](https://img.shields.io/github/license/imfunniee/gitfolio.svg?style=popout-square)