{"id":18889295,"url":"https://github.com/codebucks27/nextjs-contentlayer-blog","last_synced_at":"2025-10-07T01:57:18.452Z","repository":{"id":192558949,"uuid":"686907833","full_name":"codebucks27/Nextjs-contentlayer-blog","owner":"codebucks27","description":"⭐Build SEO optimized personal blog website with Next.js, Tailwind CSS and Contentlayer. If you want to learn to create this you can follow the tutorial link given in the Read me file.","archived":false,"fork":false,"pushed_at":"2025-03-29T18:38:38.000Z","size":21253,"stargazers_count":176,"open_issues_count":0,"forks_count":94,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-05-24T04:04:15.527Z","etag":null,"topics":["blog","contentlayer","contentlayer-nextjs","markdown","nextjs","nextjs-13","nextjs-blog","nextjs-starter","nextjs-starter-blog","nextjs-template","nextjs13","tailwindcss","webdevelopment","website-template"],"latest_commit_sha":null,"homepage":"https://create-blog-with-nextjs.vercel.app/","language":"MDX","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codebucks27.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":["codebucks27"],"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"lfx_crowdfunding":null,"polar":null,"buy_me_a_coffee":null,"thanks_dev":null,"custom":null}},"created_at":"2023-09-04T07:49:16.000Z","updated_at":"2025-05-22T16:12:21.000Z","dependencies_parsed_at":"2025-03-01T11:10:52.690Z","dependency_job_id":"e2367fd4-dddc-4cf6-ba47-3f40cbca497c","html_url":"https://github.com/codebucks27/Nextjs-contentlayer-blog","commit_stats":null,"previous_names":["codebucks27/nextjs-contentlayer-blog"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/codebucks27/Nextjs-contentlayer-blog","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebucks27%2FNextjs-contentlayer-blog","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebucks27%2FNextjs-contentlayer-blog/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebucks27%2FNextjs-contentlayer-blog/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebucks27%2FNextjs-contentlayer-blog/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codebucks27","download_url":"https://codeload.github.com/codebucks27/Nextjs-contentlayer-blog/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebucks27%2FNextjs-contentlayer-blog/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278708020,"owners_count":26031932,"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","status":"online","status_checked_at":"2025-10-06T02:00:05.630Z","response_time":65,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["blog","contentlayer","contentlayer-nextjs","markdown","nextjs","nextjs-13","nextjs-blog","nextjs-starter","nextjs-starter-blog","nextjs-template","nextjs13","tailwindcss","webdevelopment","website-template"],"created_at":"2024-11-08T07:48:25.518Z","updated_at":"2025-10-07T01:57:18.417Z","avatar_url":"https://github.com/codebucks27.png","language":"MDX","funding_links":["https://github.com/sponsors/codebucks27"],"categories":[],"sub_categories":[],"readme":"# Next.js Blog Tutorial: Build SEO Optimized Personal Blog with Next.js, Contentlayer, and Tailwind CSS 🔥\n\n![GitHub stars](https://img.shields.io/github/stars/codebucks27/Nextjs-contentlayer-blog?style=social\u0026logo=ApacheSpark\u0026label=Stars)\u0026nbsp;\u0026nbsp;\n![GitHub forks](https://img.shields.io/github/forks/codebucks27/Nextjs-contentlayer-blog?style=social\u0026logo=KashFlow\u0026maxAge=3600)\u0026nbsp;\u0026nbsp;\n![Github Followers](https://img.shields.io/github/followers/codebucks27.svg?style=social\u0026label=Follow)\u0026nbsp;\u0026nbsp;\u003cbr /\u003e\n\nThis repository contains **starter code** for Personal Blog website created using NextJs. \u003cbr /\u003e\n\nFor Demo and Final Code checkout following links👇: \u003cbr /\u003e\n[Nextjs Personal Blog Website Demo](https://create-blog-with-nextjs.vercel.app/) \u003cbr /\u003e\n\nFinal Code👇: \u003cbr /\u003e\n➡ Tutorial Code that uses Contentlayer: [Nextjs Personal Blog Website Final Code (contentlayer)](https://github.com/codebucks27/Nextjs-tailwindcss-blog-template/tree/Contentlayer) \u003cbr /\u003e\n➡ Latest Code with Velite.js instead of Contentlayer: [Nextjs Personal Blog Website Final Code (velite.js)](https://github.com/codebucks27/Nextjs-tailwindcss-blog-template) (Since contentlayer is not actively maintained, I've updated the code to use Velite.js instead.) \u003cbr /\u003e\n\nIf you want to learn how to create it please follow below tutorial👇: \u003cbr /\u003e\nhttps://youtu.be/1QGLHOaRLwM \u003cbr /\u003e\n[![YouTube Video Views](https://img.shields.io/youtube/views/1QGLHOaRLwM?style=social)](https://youtu.be/1QGLHOaRLwM)\u003cbr /\u003e\n\n### ⭐DO NOT FORGET TO STAR THIS REPO⭐\n\n### Images of The Portfolio Website:\n\n#### Home\n![Nextjs Personal Blog Website](https://github.com/codebucks27/Nextjs-contentlayer-blog/blob/main/project%20images/Home-Big.png?raw=true)\n\n#### About\n![Nextjs Personal Blog Website About Page](https://github.com/codebucks27/Nextjs-contentlayer-blog/blob/main/project%20images/About-Big.png?raw=true)\n\n#### Contact\n![Next.js Personal Blog Website Contact Page](https://github.com/codebucks27/Nextjs-contentlayer-blog/blob/main/project%20images/Cotnact-Big.png?raw=true)\n\nFor more Images please check the [project images](https://github.com/codebucks27/Nextjs-contentlayer-blog/tree/main/project%20images) folder from this repo or check the demo link. \n\n\n### Resources Used in This Project\n\n- Character image in the About page created by using [Bing Search[(https://www.bing.com/).\n- Lottie animation in the contact page: [from here](https://lottiefiles.com/animations/sloth-meditate-SzNofNFhYY)\n- Fonts from https://fonts.google.com/ \u003cbr /\u003e\n- Icons from https://iconify.design/ \u003cbr /\u003e\n\n### All the images used in the blogs:\n- Photo by \u003ca href=\"https://unsplash.com/@kmuza?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eCarlos Muza\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/hpjSkU2UYSU?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@marvelous?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eMarvin Meyer\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/SYTO3xs06fU?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@pinjasaur?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003ePaul Esch-Laurent\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/oZMUrWFHOB4?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@kellysikkema?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eKelly Sikkema\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/-1_RZL8BGBM?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@laurenmancke?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eLauren Mancke\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/aOC7TSLb1o8?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@lucabravo?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eLuca Bravo\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/XJXWbfSo2f0?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@wocintechchat?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eChristina @ wocintechchat.com\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/OtHEYbQXLFU?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@cdx2?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eC D-X\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/PDX_a_82obo?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@charlesdeluvio?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003echarlesdeluvio\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/cZr2sgaxy3Q?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@emilep?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eEmile Perron\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/xrVDYZRGdw4?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n- Photo by \u003ca href=\"https://unsplash.com/@synkevych?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eRoman Synkevych\u003c/a\u003e on \u003ca href=\"https://unsplash.com/photos/vXInUOv1n84?utm_source=unsplash\u0026utm_medium=referral\u0026utm_content=creditCopyText\"\u003eUnsplash\u003c/a\u003e\n\n\nThis is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).\n\n## Getting Started\n\nFirst, run the development server:\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000) with your browser to see the result.\n\nYou can start editing the page by modifying `app/page.js`. The page auto-updates as you edit the file.\n\nThis project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template\u0026filter=next.js\u0026utm_source=create-next-app\u0026utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodebucks27%2Fnextjs-contentlayer-blog","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodebucks27%2Fnextjs-contentlayer-blog","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodebucks27%2Fnextjs-contentlayer-blog/lists"}