{"id":17344721,"url":"https://github.com/polyneue/hubblejs","last_synced_at":"2025-04-14T20:30:24.667Z","repository":{"id":22100737,"uuid":"95300138","full_name":"Polyneue/hubblejs","owner":"Polyneue","description":"A customizable Node.js portfolio generator for developers. Powered by the Github API.","archived":false,"fork":false,"pushed_at":"2023-01-07T02:21:01.000Z","size":511,"stargazers_count":7,"open_issues_count":8,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-04-14T07:08:11.529Z","etag":null,"topics":["developer","generator","github-api","hubblejs","nodejs","portfolio"],"latest_commit_sha":null,"homepage":"https://polyneue.com/hubblejs-docs","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Polyneue.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-06-24T13:45:45.000Z","updated_at":"2023-12-05T15:30:30.000Z","dependencies_parsed_at":"2023-01-13T21:51:15.654Z","dependency_job_id":null,"html_url":"https://github.com/Polyneue/hubblejs","commit_stats":null,"previous_names":[],"tags_count":17,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Polyneue%2Fhubblejs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Polyneue%2Fhubblejs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Polyneue%2Fhubblejs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Polyneue%2Fhubblejs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Polyneue","download_url":"https://codeload.github.com/Polyneue/hubblejs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248955227,"owners_count":21189020,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["developer","generator","github-api","hubblejs","nodejs","portfolio"],"created_at":"2024-10-15T16:26:20.213Z","updated_at":"2025-04-14T20:30:24.649Z","avatar_url":"https://github.com/Polyneue.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# HubbleJS\n\n[![npm version](https://badge.fury.io/js/hubble.js.svg)](https://badge.fury.io/js/hubble.js)\n[![Coverage Status](https://coveralls.io/repos/github/Polyneue/hubblejs/badge.svg?branch=master)](https://coveralls.io/github/Polyneue/hubblejs?branch=master)\n[![Build Status](https://travis-ci.org/Polyneue/hubblejs.png?branch=master)](https://travis-ci.org/Polyneue/hubblejs)\n\nHubbleJS is a simple, customizable, Github static portfolio generator. HubbleJS is designed to quickly generate a static website with minimal configuration from the user. However, HubbleJS can be configured to use custom templates and has extensive options for generating a site unique for each portfolio.\n\n## Features\n\n* Quick and easy set up\n* Static file output, to enable hosting from anywhere\n* Personalize your Github data\n* Standardized Github response, to easily create custom templates\n* Compatible with any template engine\n\n## Getting Started\n\nHubbleJS was created to allow for quick set up with minimal configuration. Following the steps below will have your site built within minutes.\n\n* Generate a [Personal Access Token](https://github.com/settings/tokens)\n    * HubbleJS requires access to both the Repo and User scopes\n* Install HubbleJS into your project directory\n\n```shell\nnpm install --save-dev hubble.js\n```\n\n* Require HubbleJS and provide the necessary configuration\n\n```javascript\nconst Hubble = require('hubble.js');\n\n// Configure the Hubble instance\nconst hubble = new Hubble({\n  username: 'GH_USER_NAME',\n  token: 'GH_PERSONAL_ACCESS_TOKEN'\n});\n\n// Generate the site\nhubble.generate();\n```\n\nFollowing the above steps will configure HubbleJS, generate a site using the default theme, and output the HTML to `./dist/index.html`.\n\n## Configuration\n\nThere are a number of configuration options when instantiating a new HubbleJS instance. Configuration properties are optional unless otherwise noted.\n\n```javascript\nconst hubble = new Hubble({\n  \n  // REQUIRED: Your Github username\n  username: 'GH_USERNAME',\n\n  // REQUIRED: Github personal access token\n  token: 'GH_ACCESS_TOKEN',\n\n  // Names of the repositories to be displayed on the site, in this order. Default is All.\n  repositories: ['MY_REPO_NAME'],\n\n  // The location for the generated index.html file. Default is ./dist/index.html\n  output: './dist/index.html',\n\n  // The configuration for a theme.\n  theme: {\n    // ...See theme documentation for options.\n  }\n});\n\n```\n\n## API Reference\n\n### `Hubble.generate(template)`\n\nWill generate the site based on the configuration using the given template.\n\n* `template {Function}` (optional) - method that will receive data, render the data, write it to the output location, and return or throw an error.\n\n`template` receives two parameters:\n\n\u003e * `data {Object}` - Configuration and Github data\n\u003e * `output {String}` - Location to write the index.html file to\n\n**Example:**\n\n```javascript\nHubble.generate(function (data, output) {\n  const render = `\u003cp\u003e${data.user.name}'s custom template.\u003c/p\u003e`;\n  fs.writeFileSync(output, render, 'utf8');\n});\n```\n\n# Themes\n\nHubbleJS comes with a built in dark and light theme that can be used right out of the box. It can also be used with any templating language to generate pages using Github API data.\n\n## Default Theme\n\nThe default theme can be customized to reflect your personality. For customization options for the default theme, check out the repository [hubblejs-default-theme](https://github.com/Polyneue/hubblejs-default-theme#configuration).\n\n![HubbleJS Default Theme - Dark](https://raw.githubusercontent.com/Polyneue/hubblejs-default-theme/master/examples/images/hubblejs-default-theme-dark-example-1.png)\n\n## Custom Templates\n\nCreating a custom theme for HubbleJS is simple, below is a basic example of using a templating language to generate a unique theme.\n\nThe following file will be a basic pug template that will be hydrated with data.\n\n```html\np #{user.username}'s source code\n```\n\nThen we will use the Pug package to render the template.\n\n```javascript\nconst Hubble = require('hubble.js');\nconst pug = require('pug');\nconst fs = require('fs');\n\nhubble.generate(function (data, output) {\n  const render = pug.compileFile('./pug/temp.pug');\n  fs.writeFileSync(output, render, 'utf8')\n});\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpolyneue%2Fhubblejs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpolyneue%2Fhubblejs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpolyneue%2Fhubblejs/lists"}