digital-garden's Introduction

Welcome to the Digital Garden

What is a digital garden?

A Brief History & Ethos of the Digital Garden by Maggie Appleton

Tech Stack

HTML
CSS
JS
Markdown
zero-md
Cronitor RUM

Running Locally

Because the site accesses files outside of the HTML file, you need to host a server to run it locally.

Install http-server.

Run http-server -c-1 to run the server with caching disabled.

Authors

Abbey Perini - abbeyperini

Acknowledgements

Maggie Appleton for teaching me everything I know about Digital Gardens.

License

I keep my code public to help other people learn. If you build inspired by my code or tutorial, an acknowledgment in your README would be nice. To use my code exactly in your own project, personal or commercial, all you have to do is credit me in an acknowledgment in your README and visibly on the page that uses it on your site. For example: <div class="copyright">© Untitled. All rights reserved. Includes code by: <a href="https://abbeyperini.dev">Abbey Perini</a>.</div>

digital-garden's People

Contributors

Stargazers

Watchers

digital-garden's Issues

Fill out README

Duplicate "by Abbey Perini"

https://abbeyperini.com/blog.html?blog=design

Dynamic Schema Markup

Generate JSON in component?

headline
image
date published for individual blogs

https://www.link-assistant.com/news/structured-data-for-seo.html

Scroll animations

https://dribbble.com/shots/14693053-Sleepiest-Website

Reusable components for header and footer

Create theme

404 Page

JavaScript Topic?

Useful or basically the same thing as the web development topic?

search

Design blog/content pages

Design and implement footer

Small DB and API?

Put data from series.js and topic.js in a db
Use API to pull list of blogs related to topic, series etc.

Add knowledge level icons to blogs

🌱 Seedlings
🌿 Budding
🌳 Evergreen

Optimize images

Netlify deprecated image compression, so find a new solution

filtering/sorting blogs

After #2, figure out filtering and sorting based on knowledge, dates, and

CSS design pattern

BEM?

Switch title to data

blog, series, and topic components have a title attribute
switch to data attributes

https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

Local hosting with pretty URLs

Netlify post-processing includes pretty URLs. Is there a way for me to host locally and be able to use pretty URLs?

Design homepage

• details/summary planters for knowledge categories
• sorts at the top

What is a Digital Garden? page

Treat it like a docs page, list tags, topics, and sorts

Linking to topics

SEO

favicon
description - probably easier to write after the about digital garden page
keywords?
open graph
Twitter Cards
robots
schema markup

Design and implement header

link to portfolio

Automate promotion

Linking to blogs

linking to single blogs
linking to a series
dynamic SEO

Cut down on blog data fetch calls

load local file?
pass down from main file to components
record load time with slow internet and identify other improvements

Deploy

Add blog information and about page sections

Information to add to blogs:
- Knowledge level
  - 🌱 Seedlings for very rough and early ideas
  - 🌿 Budding for work I've cleaned up and clarified
  - 🌳 Evergreen for work that is reasonably complete (though I still tend these over time).
- planted
- last tended
- topic
- series
fill out about page