Skip to content

Commit

Permalink
personalized data
Browse files Browse the repository at this point in the history
  • Loading branch information
thedevdavid committed Jun 14, 2023
1 parent a6f096a commit fb10942
Show file tree
Hide file tree
Showing 22 changed files with 307 additions and 212 deletions.
163 changes: 2 additions & 161 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,163 +1,4 @@
# Modern Developer Digital Garden Starter
# My digital garden

![Image2](/screenshots/garden2.png)
[More screenshots here](/screenshots/)
Based on [https://github.com/thedevdavid/digital-garden](https://github.com/thedevdavid/digital-garden)

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https://github.com/thedevdavid/digital-garden)

An open source 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 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. You can also see the [roadmap](#features--roadmap) for planned features if you want to contribute.

## Table of Contents

- [Motivation](#motivation)
- [Getting Started](#getting-started)
- [Writing content](#writing-content)
- [Deployment](#deployment)
- [Customization](#customization)
- [Fonts](#fonts)
- [Colors](#colors)
- [Metadata](#metadata)
- [Analytics](#analytics)
- [Newsletter subscription](#newsletter-subscription)
- [Hero section](#hero-section)
- [Other tips & tricks](#other-tips--tricks)
- [Image optimization](#image-optimization)
- [Examples](#examples)
- [Features & Roadmap](#features--roadmap)

## Motivation

As a developer who creates content, I want to have a 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 subscribtions, 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.

## Getting Started

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.

### 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 digital garden'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 social links, handles, SEO, and OG.

### Analytics

_WIP_ as I'm still deciding which analytics tools to support. 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)/layout.tsx`.

1. `Simple` - A simple centered hero section with image, title, socials, and subtitle.
2. `Video` - 2 column hero section with Videoask embed on one side and title and subtitle on the other.
3. `Image` - 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.

## Examples

- [https://davidlevai.com/](https://davidlevai.com/)

Create a PR and add your digital garden 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
- [ ] Design improvements (whitespace, layout, etc.)
- [ ] `manifest.json`
- [ ] search & command bar
- [ ] newsletter integration
- [ ] Post series
- [ ] Hidden content (behind email subscription)
- [ ] 100 lighthouse score
- [ ] Command bar fuzzy search in content
- [ ] Pagination
- [ ] SEO improvements
- [ ] analytics (fathom, simplelytics, vercel)
- [ ] 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
- [ ] 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.
4 changes: 2 additions & 2 deletions app/(site)/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export default async function Home() {
<div className="pb-10">
<HeroSimple
title="Building hackin’ cool digital products around the world 🌴."
subtitle="I'm Amy. Frontend engineer writing code and blog on the internet."
subtitle="Digital nomad creating content about being a solopreneur and building production-ready apps."
/>
<div className="container mt-12 max-w-6xl">
<div className="grid grid-cols-1 place-items-start justify-between gap-12 lg:grid-cols-3">
Expand Down Expand Up @@ -74,7 +74,7 @@ export default async function Home() {
<CTA />
{aboutPage && (
<div className="container max-w-6xl">
<h2 className="mb-8 font-heading text-4xl font-bold">Who&apos;s this girl again?</h2>
<h2 className="mb-8 font-heading text-4xl font-bold">Who&apos;s this guy again?</h2>
<div className="grid grid-cols-1 place-items-start justify-between gap-12 lg:grid-cols-3">
<div className="col-span-1 mx-auto flex flex-col items-center justify-center">
<Image
Expand Down
2 changes: 1 addition & 1 deletion app/(site)/posts/[slug]/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -169,7 +169,7 @@ export default async function PostPage({ params }: PostProps) {
<div className="flex items-center rounded-md pl-2">
<ol className="list-none space-y-2" role="list">
{post.headings.map((heading: PostHeading) => (
<li key={heading.slug} className="list-none">
<li key={heading.slug} className="line-clamp-1 list-none">
<Link
className={cn("text-sm font-bold", heading.heading === 3 && "pl-6 font-normal")}
href={`#${heading.slug}`}
Expand Down
2 changes: 1 addition & 1 deletion components/command-dialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ export function CommandDialogComponent({ ...props }: DialogProps) {
}}
>
<Mail className="mr-2 h-4 w-4" />
<span>Newsletter</span>
<span>Developreneur</span>
</CommandItem>
</CommandGroup>
</CommandList>
Expand Down
4 changes: 2 additions & 2 deletions components/home-sidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,8 @@ export function Sidebar({ className, ...props }: CardProps) {
<MapPin />
<p className="ml-2 mr-auto text-sm font-medium leading-none">Los Angeles</p>
<Image
src="/losangeles.jpg"
alt="Los Angeles"
src="/barcelona.jpg"
alt="Barcelona"
width={56}
height={56}
className="h-16 w-16 rounded-md object-cover"
Expand Down
13 changes: 9 additions & 4 deletions components/navbar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const content: { title: string; href: string; description: string }[] = [
{
title: "Blog",
href: "/posts",
description: "Blogposts. Mostly about web development. Or chicken fingers",
description: "Essays, guides, smol tips & tricks, and other written content.",
},
{
title: "Speaking",
Expand All @@ -29,17 +29,22 @@ const content: { title: string; href: string; description: string }[] = [
{
title: "Videos",
href: defaultAuthor.social.youtube,
description: "My YouTube channel where I talk about web development.",
description: "Videos about web development, solopreneurship, and other related topics.",
},
{
title: "Newsletter",
href: siteMetadata.newsletterUrl,
description: "My newsletter about software development",
description: "Aka Developreneur",
},
{
title: "Teaching",
href: "/teaching",
description: "I teach others. Sometimes for free, sometimes for money.",
description: "Mentoring, courses, tutorials, and other educational content.",
},
{
title: "418 Podcast",
href: "https://podcasters.spotify.com/pod/show/418-developreneur",
description: "A podcast. Well, it will be eventually. Right now it's just one episode. But it's coming. I promise.",
},
];

Expand Down
18 changes: 9 additions & 9 deletions components/signature.tsx

Large diffs are not rendered by default.

13 changes: 9 additions & 4 deletions content/pages/about.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,19 @@ status: published
description: This is me.
---

Hey, I'm Amy, a frontend engineer, content creator, and digital nomad.
I create content about frontend engineering and UI Design apps on Twitter, and this blog. I've freelanced as a full-stack developer since my teenage years, and in 2023, I started writing this blog. Let's learn and support each other on this journey!
I'm a Content Creator, indie developer, and digital nomad.

## What's the point of blogging?
I create content about **being a solopreneur and production-ready apps**. [Twitter](https://twitter.com/thedevdavid), [YouTube](https://youtube.com/@thedevdavid), and [my blog](https://davidlevai.com/).

Since my teenage years, I have worked as a freelance full-stack developer mostly with startups and small businesses. In 2020 I decided to use this knowledge to scale a digital agency and try to build something for myself. **As of 2023, I'm building businesses in public, and helping developers become entrepreneurs.**

## What's the point of doing these in public?

- I believe you can learn a lot by following other people's journeys. I'm following a lot of other creators too.
- Through social media and public building, I get to meet interesting people and we can support each other.

While I'm away from the internet, I work out a lot and travel to see more and more of the world. _(Soon maybe another planet?)_

## What kind of stuff do you find here?

Videos, blogs, tips, and discussions. I'm also planning to start a podcast soon.
Videos, blogs, tips, and discussions. Learn how to build an international digital product agency, develop production-ready apps, and be mindful and productive as an IT entrepreneur.
12 changes: 8 additions & 4 deletions content/pages/now.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,13 @@ description: Quick way to check what I'm up to these days.

## Where am I?

I'm a digital nomad, currently in my home, the US. Spending my days in the beautiful city of LA.
I'm a digital nomad, but I'm not traveling much these days. I'm currently spending most of my time in Europe, living a habit-based life.

## What I'm working on currently?

1. Working at my day job as a frontend engineer
2. Developing indie-projects [like this developer blogging platform](https://github.com/thedevdavid/digital-garden)
1. Building a shit-ton of free stuff on YouTube
2. Mentoring developers to become solopreneurs
3. Developing indie-projects [like this developer blogging platform](https://github.com/thedevdavid/digital-garden)

## I am available for:

Expand All @@ -23,8 +24,11 @@ I'm a digital nomad, currently in my home, the US. Spending my days in the beaut

Currently, I'm **not** available for employment-based work. I'm only considering unique/exciting projects for freelance work or consulting.

For consulting I'm available maximum 3 days a week. My daily rate is $800.
For freelance projects, it depends on the requirements. Minimum project engagement is $25,000

### How do I decide about a project if it sounds exciting?

I follow the **"Hell yeah! or No** principle.
I follow the **"Hell yeah! or No"** principle.

_This page was inspired by [Derek Sivers](https://nownownow.com/about). It works as a public declaration and a reminder to myself._
13 changes: 0 additions & 13 deletions content/posts/draft-post.mdx

This file was deleted.

Loading

1 comment on commit fb10942

@vercel
Copy link

@vercel vercel bot commented on fb10942 Jun 14, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.