{"id":13618710,"url":"https://github.com/whitep4nth3r/thingoftheday","last_synced_at":"2025-03-22T15:30:49.425Z","repository":{"id":44373590,"uuid":"330620207","full_name":"whitep4nth3r/thingoftheday","owner":"whitep4nth3r","description":"thingoftheday is a lightweight microblogging site powered by Contentful and vanilla HTML, CSS and JavaScript.","archived":false,"fork":false,"pushed_at":"2022-03-21T14:00:49.000Z","size":1266,"stargazers_count":49,"open_issues_count":1,"forks_count":43,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-03-01T17:06:25.403Z","etag":null,"topics":["css","html-5","html-css-javascript","javascript","no-framework"],"latest_commit_sha":null,"homepage":"https://thingoftheday.netlify.app/","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/whitep4nth3r.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-01-18T09:45:16.000Z","updated_at":"2024-10-08T06:47:22.000Z","dependencies_parsed_at":"2022-07-12T18:20:30.301Z","dependency_job_id":null,"html_url":"https://github.com/whitep4nth3r/thingoftheday","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whitep4nth3r%2Fthingoftheday","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whitep4nth3r%2Fthingoftheday/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whitep4nth3r%2Fthingoftheday/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/whitep4nth3r%2Fthingoftheday/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/whitep4nth3r","download_url":"https://codeload.github.com/whitep4nth3r/thingoftheday/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244227559,"owners_count":20419261,"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":["css","html-5","html-css-javascript","javascript","no-framework"],"created_at":"2024-08-01T21:00:29.445Z","updated_at":"2025-03-22T15:30:48.997Z","avatar_url":"https://github.com/whitep4nth3r.png","language":"JavaScript","funding_links":[],"categories":[":star: Awesome Starters"],"sub_categories":[],"readme":"![Screenshot of thingoftheday.xyz](./screenshot.png)\n\n# thingoftheday\n\n## A lightweight microblogging site powered by Contentful and vanilla HTML, CSS and JavaScript\n\n[Visit thingoftheday](https://thingoftheday.xyz/)\n\n[Visit the tutorial article](https://www.contentful.com/blog/2021/02/05/how-to-build-a-lightweight-blog/)\n\nIf you've forked the repo and set up your own thingoftheday microblog, I'd love to share it with the world! ✨ 😎\n\n[Find me on Twitter](https://twitter.com/whitep4nth3r) and say hello! 👋🏼\n\n## Useful links\n\nContentful GraphiQL Playground:\n\n`https://graphql.contentful.com/content/v1/spaces/{YOUR_SPACE_ID}/explore?access_token={YOUR_ACCESS_TOKEN}`\n\n---\n\n## Want to build your own thingoftheday?\n\nFollow this quick setup guide to get started in minutes!\n\nWe're going to make some small changes to some handy files in the `./setup` directory, and use the Contentful CLI to import the content model and example content provided into your own Contentful space.\n\n## Step 1: Get the code\n\nFork this repository to your GitHub account, and clone it to your local machine using git or the GitHub CLI.\n\n---\n\n## Step 2: Get Contentful\n\nCreate your Contentful account.\n[Sign up here.](https://www.contentful.com/sign-up/)\n\n---\n\n## Step 3: Get credentials\n\n- Create a new space inside your Contentful account\n- Go to Settings \u003e General Settings and make a note of the Space ID\n- Go to Settings \u003e API keys and generate an access token for the Content Delivery API\n- Add your Space ID and access token to `./setup/credentials.js`\n\n---\n\n## Step 4: Install the Contentful CLI\n\nUsing homebrew:\n\n```bash\nbrew install contentful-cli\n```\n\nUsing npm:\n\n```bash\nnpm install -g contentful-cli\n```\n\nUsing yarn:\n\n```bash\nyarn global add contentful-cli\n\n```\n\n---\n\n## Step 5: Authenticate with the CLI\n\nRun `contentful login` in your terminal and follow the instructions in your browser.\n\n---\n\n## Step 6: Run the import\n\nImport the content model and example post to your Contentful space.\n\n[Access the Contentful CLI docs on importing/exporting data here.](https://www.contentful.com/developers/docs/tutorials/cli/import-and-export/)\n\n### ::TLDR\n\nRun the following command in your terminal, ensuring you switch out SPACE_ID for your new Space ID.\n\n```bash\ncd /path/to/repo/thingoftheday/setup\n\ncontentful space import --space-id SPACE_ID --content-file contentful-export.json\n```\n\nThe terminal will do some fancy things. If all looks good - refresh Contentful in your browser and you'll find the content model and example post has been imported for you! 🎉🎉🎉\n\n---\n\n## Step 7: Run the application\n\nthingoftheday uses no frameworks and is powered by vanilla HTML, CSS and JavaScript!\n\nTo be able to serve the JS module to the browser, you'll need to serve the files over a local http server.\n\n[You can do this really nicely with this http-server package.](https://www.npmjs.com/package/http-server)\n\nInstall http-server globally, and start the development server locally by running:\n\n```bash\ncd path/to/repo\nnpx http-server\n```\n\n## And you're done\n\nWith your http server started, your credentials file configured, and your content model imported, you'll be able to visit your very own thingoftheday microblog in your browser - all within minutes.\n\n## BONUS CONTENT\n\nGenerate an RSS feed of the content by hitting the following url:\n\n```bash\nhttps://{hostname}/.netlify/functions/rss\n```\n\n[The RSS feed for thingoftheday.xyz is available here](https://thingoftheday.xyz/.netlify/functions/rss).\n\nAnd remember:\n\n## _Build stuff, learn things, love what you do_\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwhitep4nth3r%2Fthingoftheday","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwhitep4nth3r%2Fthingoftheday","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwhitep4nth3r%2Fthingoftheday/lists"}