diff --git a/CHANGELOG.md b/CHANGELOG.md index b509c1c..3648ac5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Added contributors to docs - Redesigned work availability badge - Fixed table of contents crash +- Updated documentation with new features ## [0.4.1] - 2023-07-03 diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md deleted file mode 100644 index 2351b4a..0000000 --- a/CODE_OF_CONDUCT.md +++ /dev/null @@ -1,131 +0,0 @@ -# Contributor Covenant Code of Conduct - -## Our Pledge - -We as members, contributors, and leaders pledge to make participation in our -community a harassment-free experience for everyone, regardless of age, body -size, visible or invisible disability, ethnicity, sex characteristics, gender -identity and expression, level of experience, education, socio-economic status, -nationality, personal appearance, race, caste, color, religion, or sexual -identity and orientation. - -We pledge to act and interact in ways that contribute to an open, welcoming, -diverse, inclusive, and healthy community. - -## Our Standards - -Examples of behavior that contributes to a positive environment for our -community include: - -- Demonstrating empathy and kindness toward other people -- Being respectful of differing opinions, viewpoints, and experiences -- Giving and gracefully accepting constructive feedback -- Accepting responsibility and apologizing to those affected by our mistakes, - and learning from the experience -- Focusing on what is best not just for us as individuals, but for the overall - community - -Examples of unacceptable behavior include: - -- The use of sexualized language or imagery, and sexual attention or advances of - any kind -- Trolling, insulting or derogatory comments, and personal or political attacks -- Public or private harassment -- Publishing others' private information, such as a physical or email address, - without their explicit permission -- Other conduct which could reasonably be considered inappropriate in a - professional setting - -## Enforcement Responsibilities - -Community leaders are responsible for clarifying and enforcing our standards of -acceptable behavior and will take appropriate and fair corrective action in -response to any behavior that they deem inappropriate, threatening, offensive, -or harmful. - -Community leaders have the right and responsibility to remove, edit, or reject -comments, commits, code, wiki edits, issues, and other contributions that are -not aligned to this Code of Conduct, and will communicate reasons for moderation -decisions when appropriate. - -## Scope - -This Code of Conduct applies within all community spaces, and also applies when -an individual is officially representing the community in public spaces. -Examples of representing our community include using an official e-mail address, -posting via an official social media account, or acting as an appointed -representative at an online or offline event. - -## Enforcement - -Instances of abusive, harassing, or otherwise unacceptable behavior may be -reported to the community leaders responsible for enforcement at @thedevdavid. -All complaints will be reviewed and investigated promptly and fairly. - -All community leaders are obligated to respect the privacy and security of the -reporter of any incident. - -## Enforcement Guidelines - -Community leaders will follow these Community Impact Guidelines in determining -the consequences for any action they deem in violation of this Code of Conduct: - -### 1. Correction - -**Community Impact**: Use of inappropriate language or other behavior deemed -unprofessional or unwelcome in the community. - -**Consequence**: A private, written warning from community leaders, providing -clarity around the nature of the violation and an explanation of why the -behavior was inappropriate. A public apology may be requested. - -### 2. Warning - -**Community Impact**: A violation through a single incident or series of -actions. - -**Consequence**: A warning with consequences for continued behavior. No -interaction with the people involved, including unsolicited interaction with -those enforcing the Code of Conduct, for a specified period of time. This -includes avoiding interactions in community spaces as well as external channels -like social media. Violating these terms may lead to a temporary or permanent -ban. - -### 3. Temporary Ban - -**Community Impact**: A serious violation of community standards, including -sustained inappropriate behavior. - -**Consequence**: A temporary ban from any sort of interaction or public -communication with the community for a specified period of time. No public or -private interaction with the people involved, including unsolicited interaction -with those enforcing the Code of Conduct, is allowed during this period. -Violating these terms may lead to a permanent ban. - -### 4. Permanent Ban - -**Community Impact**: Demonstrating a pattern of violation of community -standards, including sustained inappropriate behavior, harassment of an -individual, or aggression toward or disparagement of classes of individuals. - -**Consequence**: A permanent ban from any sort of public interaction within the -community. - -## Attribution - -This Code of Conduct is adapted from the [Contributor Covenant][homepage], -version 2.1, available at -[https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1]. - -Community Impact Guidelines were inspired by -[Mozilla's code of conduct enforcement ladder][Mozilla CoC]. - -For answers to common questions about this code of conduct, see the FAQ at -[https://www.contributor-covenant.org/faq][FAQ]. Translations are available at -[https://www.contributor-covenant.org/translations][translations]. - -[homepage]: https://www.contributor-covenant.org -[v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html -[Mozilla CoC]: https://github.com/mozilla/diversity -[FAQ]: https://www.contributor-covenant.org/faq -[translations]: https://www.contributor-covenant.org/translations diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md deleted file mode 100644 index 6f0ae15..0000000 --- a/CONTRIBUTING.md +++ /dev/null @@ -1,22 +0,0 @@ -# Contributing Guidelines - -I'd love your input! This project is from developers for developers. Please feel free to: - -- Report a bug -- Discuss the current state and ideas for improvements -- Submit a fix -- Propose new features - -## How? - -Based on [Github Flow](https://guides.github.com/introduction/flow/index.html). - -1. Fork the repo and create your branch from `develop`. -2. Add your code. -3. Update the documentation. -4. Make sure your code lints. -5. Open pull request to `develop` branch. - -## Any contributions you make will be under the MIT Software License - -In short, when you submit code changes, your submissions are understood to be under the same [MIT License](http://choosealicense.com/licenses/mit/) that covers the project. diff --git a/README.md b/README.md index 91acc90..6c7d86f 100644 --- a/README.md +++ b/README.md @@ -7,8 +7,6 @@ An open source blogging (digital gardening) template for developers using [Next.js](https://nextjs.org/) app router, MDX, [Contentlayer](https://contentlayer.dev/), [Tailwind CSS](https://tailwindcss.com/), [@shadcn/ui](https://ui.shadcn.com/) , [Lucide Icons](https://lucide.dev/icons), and more. -This project is from developers for developers. Please feel free to report a bug, discuss the current state, submit ideas for improvements, submit a fix, propose new features, or whatever you want. All contributions are welcome! Read more at the [contributing guidelines](./CONTRIBUTING.md). - If you love this template and/or use it, please give it a star on GitHub. This will help more people discover it, thus help improving the template. ![GitHub Repo stars](https://img.shields.io/github/stars/thedevdavid/digital-garden?style=social) @@ -32,6 +30,9 @@ If you love this template and/or use it, please give it a star on GitHub. This w - [Image optimization](#image-optimization) - [Examples](#examples) - [Features & Roadmap](#features--roadmap) +- [Contributing](#contributing) + - [Contributors](#contributors) + - [How?](#how) - [Inspiration & Mentions](#inspiration--mentions) - [Support](#support) @@ -47,12 +48,13 @@ If you want to see how I set up this template for my own digital garden, you can 1. Use the repo as a template 2. Install dependencies with `pnpm install` -3. Edit `utils/metadata.ts` with your information -4. Edit `utils/usesData.ts` with your information -5. Edit `utils/projectsData.ts` with your information -6. Edit `content/pages/now` with your information -7. Edit `content/pages/about` with your information -8. Run the development server with `pnpm dev` +3. Edit `utils/metadata.ts` with your information and general settings +4. Edit `utils/uses-data.ts` with software & hardware you use +5. Edit `utils/projects-data.ts` with your projects +6. Edit `utils/navigation-links.ts` with the links you want in the navigation +7. Edit `content/pages/now` with your availability +8. Edit `content/pages/about` with your bio +9. Run the development server with `pnpm dev` Open [http://localhost:3000](http://localhost:3000) in your browser to see the result. @@ -71,8 +73,11 @@ Editing list pages is done in the `lib` folder. You can deploy the project with [Vercel](https://vercel.com/) or any other hosting provider. If you want to use Vercel, you can use the button at the top of this README. 1. Update `package.json` author information -2. Set up the `NEXT_PUBLIC_BASE_URL` environment variable on Vercel to point to your website's root URL -3. Build and deploy +2. Publish your repo to GitHub +3. Create a new project on Vercel and import your repo +4. Set up the `NEXT_PUBLIC_BASE_URL` environment variable on Vercel to point to your website's root URL +5. If you plan to use [analytics](#analytics) and/or [newsletter](#newsletter-subscription) providers, set up the respective environment variables on Vercel +6. Build and deploy 🎉 ## Customization @@ -84,9 +89,17 @@ This project uses [Inter](https://rsms.me/inter/) as the default font. You can c The project uses Tailwind colors and @shadcn/ui config. Customize the colors on `globals.css`. +### Signature + +There's a signature component to use in the footer. You can edit the signature on `components/signature.tsx`. I used Figma to write the signature with `Caveat` font and exported it as SVG. You can do the same and update the SVG in the component. + +### Images + +Images and other media files are located in `public/` directory. You can use them in your content by using the `/.` path. + ### Metadata -You can change the metadata in `utils/metadata.ts`. This will be used around the site for titles, social links, social handles, SEO, etc. +You can change the metadata and author details in `utils/metadata.ts`. This will be used around the site for titles, social links, social handles, SEO, etc. You can edit navigation links in `lib/navigation-links.ts`. @@ -98,14 +111,14 @@ To configure, you need to enable it on [Vercel project dashboard](https://vercel #### Umami -Umami is a simple, easy to use, web analytics solution with self-hosting option! You can read more about it on [Umami website](https://umami.is/). (Hint: On [Railway](https://railway.app), you can self-host it low cost or even free) +Umami is a simple, easy to use, web analytics solution with self-hosting option! You can read more about it on [Umami website](https://umami.is/). _(Hint: On [Railway](https://railway.app), you can self-host it low cost or even free)_. Configure: Set `NEXT_PUBLIC_UMAMI_SCRIPT_URL` & `NEXT_PUBLIC_UMAMI_WEBSITE_ID` environment variables on your `.env.local` file and on Vercel dashboard. #### Others -Supporting other analytics providers are planned. Feel free to open an issue if you have any suggestions or a PR if you want to implement it yourself. +Supporting other analytics providers are in progress. Feel free to open an issue if you have any suggestions or a PR if you want to implement it yourself. ### Newsletter subscription @@ -115,9 +128,10 @@ _WIP_ as I'm still deciding which email tools to support. Feel free to open an i You can choose between 3 different hero variants to use in `app/(site)/page.tsx` by changing the imported hero component. -1. `HeroSimple` - A simple centered hero section with image, title, socials, and subtitle. +1. `HeroSimple` - A simple centered hero section with image, title, and subtitle. 2. `HeroVideo` - 2 column hero section with Videoask embed on one side and title and subtitle on the other. -3. `HeroImage` - 2 column hero section with image on one side and title, socials, and subtitle on the other. +3. `HeroImage` - 2 column hero section with image on one side and title, and subtitle on the other. +4. `HeroMinimal` - small hero section name & job title ### Other tips & tricks @@ -131,7 +145,7 @@ Note: DO NOT overdo it. You can easily make images look bad with lossy compressi - [https://davidlevai.com/](https://davidlevai.com/) -Create a PR and add your blog to this list if you're using the template! +**Create a PR and add your blog to this list if you're using the template!** ## Features & Roadmap @@ -155,16 +169,20 @@ Create a PR and add your blog to this list if you're using the template! - [x] Analytics: Vercel, Umami - [x] Post series - [x] Not found page -- [ ] Docs rework -- [ ] hero title and subtitle text HTML support(?) +- [x] contributing docs +- [x] Docs refresh - [ ] Social sharing buttons +- [ ] newsletter integration (form, api route, keys, welcome page, previous issues) - [ ] Other analytics providers (fathom, simplelytics, plausible, etc) +- [ ] Tags, categories +- [ ] Post series page +- [ ] Layouts/templates system +- [ ] hero title and subtitle text HTML support(?) - [ ] Design improvements (whitespace, layout, etc.) -- [ ] 404, error, and loading pages +- [ ] error, and loading pages - [ ] Code preview component - [ ] Code highlight improvements (copy code, theme) - [ ] `manifest.json` -- [ ] newsletter integration (form, api route, keys, welcome page, previous issues) - [ ] Hidden content (behind email subscription) - [ ] 100 lighthouse score - [ ] Command bar fuzzy search in content @@ -178,16 +196,38 @@ Create a PR and add your blog to this list if you're using the template! - [ ] general cleanup - [ ] implement content security policies - [ ] implement a videoask-like solution for the hero section +- [ ] RSS feed improvements (image, description, etc.) - [ ] multi-author support (?) - [ ] Post like counter (?) - [ ] Visitor counter (?) - [ ] code playground instead of code highlighting (?) -- [ ] Categories and/or tags (?) - [ ] Commenting system (?) - [ ] keyboard-based navigation with hotkeys (?) -- [ ] multiple layouts (sidebar, full-width, etc.) (?) - [ ] multilang support (?) -- [ ] contributing docs + +## Contributing + +### Contributors + +- @thedevdavid +- @br4adam + +This project is from developers for developers. All contributions are welcome! Please feel free to: + +- Report a bug +- Discuss the current state and ideas for improvements +- Submit a fix +- Propose new features + +### How? + +1. Fork the repo and create your branch from `develop`. +2. Add your code. +3. Update the documentation. +4. Make sure your code lints and the app builds. +5. Open pull request to `develop` branch. + +Any contributions you make will be under the MIT Software License. In short, when you submit code changes, your submissions are understood to be under the same [MIT License](http://choosealicense.com/licenses/mit/) that covers the project. Code of Conduct can be found [here](https://gist.github.com/thedevdavid/08e306cee9dc1b6b7f3c209827277a82). ## Inspiration & Mentions diff --git a/components/home-sidebar.tsx b/components/home-sidebar.tsx index d38e912..c1dc66f 100644 --- a/components/home-sidebar.tsx +++ b/components/home-sidebar.tsx @@ -4,10 +4,11 @@ import Image from "next/image"; import Link from "next/link"; import { ArrowRight, MapPin, Pencil } from "lucide-react"; +import { defaultAuthor } from "@/lib/metadata"; import { projects } from "@/lib/projects-data"; import { cn } from "@/lib/utils"; import { Button } from "@/components/ui/button"; -import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"; +import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"; import { Separator } from "@/components/ui/separator"; type CardProps = React.ComponentProps; @@ -22,9 +23,9 @@ export function Sidebar({ className, ...props }: CardProps) {
-

Los Angeles

+

{defaultAuthor.location.city}

Los Angeles.` path. + +### Metadata + +You can change the metadata and author details in `utils/metadata.ts`. This will be used around the site for titles, social links, social handles, SEO, etc. + +You can edit navigation links in `lib/navigation-links.ts`. + +### Analytics + +#### Vercel + +To configure, you need to enable it on [Vercel project dashboard](https://vercel.com/dashboard) by selecting your Project and then click the Analytics tab and click Enable from the dialog. + +#### Umami + +Umami is a simple, easy to use, web analytics solution with self-hosting option! You can read more about it on [Umami website](https://umami.is/). _(Hint: On [Railway](https://railway.app), you can self-host it low cost or even free)_. + +Configure: +Set `NEXT_PUBLIC_UMAMI_SCRIPT_URL` & `NEXT_PUBLIC_UMAMI_WEBSITE_ID` environment variables on your `.env.local` file and on Vercel dashboard. + +#### Others + +Supporting other analytics providers are in progress. Feel free to open an issue if you have any suggestions or a PR if you want to implement it yourself. + +### Newsletter subscription + +_WIP_ as I'm still deciding which email tools to support. Feel free to open an issue if you have any suggestions or a PR if you want to implement it yourself. + +### Hero section + +You can choose between 3 different hero variants to use in `app/(site)/page.tsx` by changing the imported hero component. + +1. `HeroSimple` - A simple centered hero section with image, title, and subtitle. +2. `HeroVideo` - 2 column hero section with Videoask embed on one side and title and subtitle on the other. +3. `HeroImage` - 2 column hero section with image on one side and title, and subtitle on the other. +4. `HeroMinimal` - small hero section name & job title + +### Other tips & tricks + +#### Image optimization + +Optimize images in seconds for free with ImageOptim. Install on your Mac, then open the `public` folder in Finder. Select all images, right-click, and choose "Open with > ImageOptim". This will optimize all images in the folder. + +Note: DO NOT overdo it. You can easily make images look bad with lossy compression algorithms. diff --git a/content/posts/test.mdx b/content/posts/test.mdx deleted file mode 100644 index b6746ec..0000000 --- a/content/posts/test.mdx +++ /dev/null @@ -1,199 +0,0 @@ ---- -title: Modern Developer Blog Template (Digital Garden Starter) -publishedDate: "2023-05-31" -lastUpdatedDate: "2023-07-05" -tags: - - "jamstack" - - "technology" - - "javascript" - - "frontend" - - "development" - - "opinion" -description: As a developer who creates content, I want to have a blog & digital garden where I can share my thoughts and ideas with the world. Now, there's not really a "perfect solution" for this currently. With included analytics, SEO, email subscriptions, modern tooling, simple design, etc. We either have to build one from scratch, use a design template and code the features, or use a CMS/no-code tool. -status: published -series: - order: 1 - title: "Using this template" ---- - -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/thedevdavid/digital-garden) - -An open source blogging (digital gardening) template for developers using [Next.js](https://nextjs.org/) app router, MDX, [Contentlayer](https://contentlayer.dev/), [Tailwind CSS](https://tailwindcss.com/), [@shadcn/ui](https://ui.shadcn.com/) , [Lucide Icons](https://lucide.dev/icons), and more. - -This project is from developers for developers. Please feel free to report a bug, discuss the current state, submit ideas for improvements, submit a fix, propose new features, or whatever you want. All contributions are welcome! Read more at the [contributing guidelines](./CONTRIBUTING.md). - -If you love this template and/or use it, please give it a star on GitHub. This will help more people discover it, thus help improving the template. - -![GitHub Repo stars](https://img.shields.io/github/stars/thedevdavid/digital-garden?style=social) - -**Note: This project is always evolving and it's far from being perfect or even done.**[^1] I'm always open to suggestions and contributions. Feel free to open an issue or a PR if you have any ideas or suggestions. You can also see the [roadmap](#features--roadmap) for planned features if you want to contribute. -[^1]: Big note. - -```hello.js -let hello = "hello darkness"; - -console.log(hello, "my old friend"); -``` - -## Motivation - -As a developer who creates content, I want to have a blog & digital garden where I can share my thoughts and ideas with the world. Now, there's not really a "perfect solution" for this currently. With included analytics, SEO, email subscriptions, modern tooling, simple design, etc. We either have to build one from scratch, use a design template and code the features, or use a CMS/no-code tool. - -## Getting Started - -If you want to see how I set up this template for my own digital garden, you can check out [this commit](https://github.com/thedevdavid/website-2023/commit/fb10942d424a1389f9c4c1605849e45ff718656d) with all the changes. - -1. Use the repo as a template -2. Install dependencies with `pnpm install` -3. Edit `utils/metadata.ts` with your information -4. Edit `utils/usesData.ts` with your information -5. Edit `utils/projectsData.ts` with your information -6. Edit `content/pages/now` with your information -7. Edit `content/pages/about` with your information -8. Run the development server with `pnpm dev` - -Open [http://localhost:3000](http://localhost:3000) in your browser to see the result. - -### Writing content - -You can write content in Markdown or MDX. The content is located in `content/` and is organized in folders. The `pages` folder contains the pages. The `posts` folder contains the blogposts. The `projects` folder contains the projects. - -Editing list pages is done in the `lib` folder. - -- `/uses` - `lib/uses-data.ts` -- `/projects` - `lib/projects-data.ts` -- `/social` - `lib/social-data.ts` - -### Deployment - -You can deploy the project with [Vercel](https://vercel.com/) or any other hosting provider. If you want to use Vercel, you can use the button at the top of this README. - -1. Update `package.json` author information -2. Set up the `NEXT_PUBLIC_BASE_URL` environment variable on Vercel to point to your website's root URL -3. Build and deploy - -## Customization - -### Fonts - -This project uses [Inter](https://rsms.me/inter/) as the default font. You can change it on `app/layout.tsx` using the `next/fonts` package. - -### Colors - -The project uses Tailwind colors and @shadcn/ui config. Customize the colors on `globals.css`. - -### Metadata - -You can change the metadata in `utils/metadata.ts`. This will be used around the site for titles, social links, social handles, SEO, etc. - -You can edit navigation links in `lib/navigation-links.ts`. - -### Analytics - -#### Vercel - -To configure, you need to enable it on [Vercel project dashboard](https://vercel.com/dashboard) by selecting your Project and then click the Analytics tab and click Enable from the dialog. - -#### Umami - -Umami is a simple, easy to use, web analytics solution with self-hosting option! You can read more about it on [Umami website](https://umami.is/). (Hint: On [Railway](https://railway.app), you can self-host it low cost or even free) - -Configure: -Set `NEXT_PUBLIC_UMAMI_SCRIPT_URL` & `NEXT_PUBLIC_UMAMI_WEBSITE_ID` environment variables on your `.env.local` file and on Vercel dashboard. - -#### Others - -Supporting other analytics providers are planned. Feel free to open an issue if you have any suggestions or a PR if you want to implement it yourself. - -### Newsletter subscription - -_WIP_ as I'm still deciding which email tools to support. Feel free to open an issue if you have any suggestions or a PR if you want to implement it yourself. - -### Hero section - -You can choose between 3 different hero variants to use in `app/(site)/page.tsx` by changing the imported hero component. - -1. `HeroSimple` - A simple centered hero section with image, title, socials, and subtitle. -2. `HeroVideo` - 2 column hero section with Videoask embed on one side and title and subtitle on the other. -3. `HeroImage` - 2 column hero section with image on one side and title, socials, and subtitle on the other. - -### Other tips & tricks - -#### Image optimization - -Optimize images in seconds for free with ImageOptim. Install on your Mac, then open the `public` folder in Finder. Select all images, right-click, and choose "Open with > ImageOptim". This will optimize all images in the folder. - -Note: DO NOT overdo it. You can easily make images look bad with lossy compression algorithms. - -## Examples - -- [https://davidlevai.com/](https://davidlevai.com/) - -Create a PR and add your blog to this list if you're using the template! - -## Features & Roadmap - -- [x] Basic functionality of reading pages and posts -- [x] Basic design dark/light mode -- [x] MDX code highlighting -- [x] Readme.md -- [x] `robots.txt` & `sitemap.xml` -- [x] RSS Feed -- [x] Reading time estimate -- [x] LICENSE -- [x] contributing.md -- [x] MDX components (TOC & footnotes) -- [x] general config & metadata (author, URL, socials, etc.) -- [x] uses page -- [x] Link in bio page -- [x] OG image generation -- [x] projects page -- [x] about section on homepage -- [x] search & command bar -- [x] Analytics: Vercel, Umami -- [x] Post series -- [x] Not found page -- [ ] Docs rework -- [ ] hero title and subtitle text HTML support(?) -- [ ] Social sharing buttons -- [ ] Other analytics providers (fathom, simplelytics, plausible, etc) -- [ ] Design improvements (whitespace, layout, etc.) -- [ ] 404, error, and loading pages -- [ ] Code preview component -- [ ] Code highlight improvements (copy code, theme) -- [ ] `manifest.json` -- [ ] newsletter integration (form, api route, keys, welcome page, previous issues) -- [ ] Hidden content (behind email subscription) -- [ ] 100 lighthouse score -- [ ] Command bar fuzzy search in content -- [ ] Pagination -- [ ] SEO improvements -- [ ] Accessibility audit -- [ ] TypeScript fixes -- [ ] Redesign uses page -- [ ] Redesign projects page -- [ ] general refactor -- [ ] general cleanup -- [ ] implement content security policies -- [ ] implement a videoask-like solution for the hero section -- [ ] multi-author support (?) -- [ ] Post like counter (?) -- [ ] Visitor counter (?) -- [ ] code playground instead of code highlighting (?) -- [ ] Categories and/or tags (?) -- [ ] Commenting system (?) -- [ ] Social sharing buttons (?) -- [ ] keyboard-based navigation with hotkeys (?) -- [ ] multiple layouts (sidebar, full-width, etc.) (?) -- [ ] multilang support (?) - -## Inspiration & Mentions - -- [Delba Oliveira Personal Blog](https://github.com/delbaoliveira/website) - Using and structuring table of contents with Contentlayer -- [timlrx/tailwind-nextjs-starter-blog](https://github.com/timlrx/tailwind-nextjs-starter-blog) - Idea - -## Support - -If you love this template and/or use it, please give it a star on GitHub. - -[^1]: Yep, this is a footnote diff --git a/content/posts/what-is-this.mdx b/content/posts/what-is-this.mdx index e8b97a6..1884046 100644 --- a/content/posts/what-is-this.mdx +++ b/content/posts/what-is-this.mdx @@ -13,4 +13,119 @@ series: title: "Using this template" --- +An open source blogging (digital gardening) template for developers using [Next.js](https://nextjs.org/) app router, MDX, [Contentlayer](https://contentlayer.dev/), [Tailwind CSS](https://tailwindcss.com/), [@shadcn/ui](https://ui.shadcn.com/) , [Lucide Icons](https://lucide.dev/icons), and more. + +If you love this template and/or use it, please give it a star on GitHub. This will help more people discover it, thus help improving the template. + +![GitHub Repo stars](https://img.shields.io/github/stars/thedevdavid/digital-garden?style=social) + +**Note: This project is always evolving and it's far from being perfect or even done.** I'm always open to suggestions and contributions. Feel free to open an issue or a PR if you have any ideas or suggestions.[^1]: Big note. + +## Motivation + +As a developer who creates content, I want to have a blog & digital garden where I can share my thoughts and ideas with the world. Now, there's not really a "perfect solution" for this currently. With included analytics, SEO, email subscriptions, modern tooling, simple design, etc. We either have to build one from scratch, use a design template and code the features, or use a CMS/no-code tool. + +So I decided to build a solution that I would use myself. This is the result. + +## Examples + +- [https://davidlevai.com/](https://davidlevai.com/) + +**Create a PR and add your blog to this list if you're using the template!** + +## Features & Roadmap + +- [x] Basic functionality of reading pages and posts +- [x] Basic design dark/light mode +- [x] MDX code highlighting +- [x] Readme.md +- [x] `robots.txt` & `sitemap.xml` +- [x] RSS Feed +- [x] Reading time estimate +- [x] LICENSE +- [x] contributing.md +- [x] MDX components (TOC & footnotes) +- [x] general config & metadata (author, URL, socials, etc.) +- [x] uses page +- [x] Link in bio page +- [x] OG image generation +- [x] projects page +- [x] about section on homepage +- [x] search & command bar +- [x] Analytics: Vercel, Umami +- [x] Post series +- [x] Not found page +- [x] contributing docs +- [x] Docs refresh +- [ ] Social sharing buttons +- [ ] newsletter integration (form, api route, keys, welcome page, previous issues) +- [ ] Other analytics providers (fathom, simplelytics, plausible, etc) +- [ ] Tags, categories +- [ ] Post series page +- [ ] Layouts/templates system +- [ ] hero title and subtitle text HTML support(?) +- [ ] Design improvements (whitespace, layout, etc.) +- [ ] error, and loading pages +- [ ] Code preview component +- [ ] Code highlight improvements (copy code, theme) +- [ ] `manifest.json` +- [ ] Hidden content (behind email subscription) +- [ ] 100 lighthouse score +- [ ] Command bar fuzzy search in content +- [ ] Pagination +- [ ] SEO improvements +- [ ] Accessibility audit +- [ ] TypeScript fixes +- [ ] Redesign uses page +- [ ] Redesign projects page +- [ ] general refactor +- [ ] general cleanup +- [ ] implement content security policies +- [ ] implement a videoask-like solution for the hero section +- [ ] RSS feed improvements (image, description, etc.) +- [ ] multi-author support (?) +- [ ] Post like counter (?) +- [ ] Visitor counter (?) +- [ ] code playground instead of code highlighting (?) +- [ ] Commenting system (?) +- [ ] keyboard-based navigation with hotkeys (?) +- [ ] multilang support (?) + +## Contributing + +### Contributors + +- @thedevdavid +- @br4adam + +This project is from developers for developers. All contributions are welcome! Please feel free to: + +- Report a bug +- Discuss the current state and ideas for improvements +- Submit a fix +- Propose new features + +### How? + +1. Fork the repo and create your branch from `develop`. +2. Add your code. +3. Update the documentation. +4. Make sure your code lints and the app builds. +5. Open pull request to `develop` branch. + +Any contributions you make will be under the MIT Software License. In short, when you submit code changes, your submissions are understood to be under the same [MIT License](http://choosealicense.com/licenses/mit/) that covers the project. Code of Conduct can be found [here](https://gist.github.com/thedevdavid/08e306cee9dc1b6b7f3c209827277a82). + +## Inspiration & Mentions + +- [Delba Oliveira Personal Blog](https://github.com/delbaoliveira/website) - Using and structuring table of contents with Contentlayer +- [timlrx/tailwind-nextjs-starter-blog](https://github.com/timlrx/tailwind-nextjs-starter-blog) - Idea + +## Support + +If you love this template and/or use it, please give it a star on GitHub. + +--- + This post will be the first part of a series of posts that will explain how to use this starter template. This post will explain what this starter template is and what it is not. + +[^1]: Yep, this is a footnote diff --git a/lib/metadata.ts b/lib/metadata.ts index 8c14aaa..c83cf58 100644 --- a/lib/metadata.ts +++ b/lib/metadata.ts @@ -1,8 +1,8 @@ -import { SiteMetaData } from "@/types"; +import { AuthorType, SiteMetaData } from "@/types"; export const BASE_URL = process.env.NEXT_PUBLIC_BASE_URL || "http://localhost:3000"; -export const defaultAuthor = { +export const defaultAuthor: AuthorType = { name: "Amy Shields", handle: "@amyshieldsfake", social: { @@ -18,6 +18,10 @@ export const defaultAuthor = { jobTitle: "Frontend Engineer & UI Designer", company: "Unicorns & Co.", availableForWork: true, + location: { + city: "Los Angeles", + media: "/losangeles.jpg", + }, }; const defaultTitle = `${defaultAuthor.name}'s Blog`; diff --git a/next.config.js b/next.config.js index 0b34d6c..dca8812 100644 --- a/next.config.js +++ b/next.config.js @@ -4,6 +4,12 @@ const { withContentlayer } = require("next-contentlayer"); const nextConfig = { reactStrictMode: true, swcMinify: true, + rewrites: async () => [ + { + source: "/posts/test", + destination: "/posts/get-started", + }, + ], }; module.exports = withContentlayer(nextConfig); diff --git a/public/signature.svg b/public/signature.svg deleted file mode 100644 index 8f1fbe7..0000000 --- a/public/signature.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/types/index.tsx b/types/index.tsx index 0417a96..8de862e 100644 --- a/types/index.tsx +++ b/types/index.tsx @@ -48,3 +48,25 @@ export type SeriesItem = { export type PostSeries = Series & { posts: SeriesItem[] }; export type PostWithSeries = Omit & { series: PostSeries }; + +export type AuthorType = { + name: string; + handle: string; + social: { + github: string; + instagram: string; + linkedin: string; + tiktok: string; + twitter: string; + youtube: string; + }; + email: string; + website: string; + jobTitle: string; + company: string; + availableForWork: boolean; + location: { + city: string; + media: string; + }; +};