Maggieappleton.com

screenshot of Maggieappleton.com
gatsby
react
chakra-ui

Now retired. My previous, poorly constructed digital garden built with Gatsby and MDX. Updated garden here: https://github.com/MaggieAppleton/maggieappleton.com-V2

Overview:

Maggie's Internet Space is a public digital garden repository that serves as an example for building an individual digital garden. It emphasizes the importance of creating unique and personal digital spaces, with the understanding that the code may not be easily adaptable or aesthetically pleasing for all users.

Features:

  • Tech Stack: Built using Gatsby.js, MDX for JavaScript/React in Markdown, Prism.js for syntax highlighting, and Typography.js for text styling.
  • Self-hosted fonts: Utilizes GT Walsheim, Freight Sans Pro, and Freight Serif fonts.
  • Social Media Share Buttons: Integration for easy sharing of content on social platforms.
  • Programmatic Page Generation: Generates multi-category MDX pages with varied templates.
  • Local Pagination: Includes pagination for different category types within the site.
  • Tooltip Popovers: Uses Tippy.js for tooltip functionality.
  • Search Functionality: Work in progress feature to enable search within the digital garden.
  • Wiki-Style Note Organization: Organizes content in nested note folders for a wiki-style experience.
  • Webmentions: Allows for webmentions to be integrated.
gatsby
Gatsby

GatsbyJS is a free and open-source static site generator based on React. It uses a modern development stack including Webpack, GraphQL, and modern JavaScript and CSS frameworks. It also provides a rich set of plugins, starters, and themes.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

chakra-ui
Chakra UI

Chakra UI is a popular open-source React component library that provides a set of accessible and customizable UI components to help developers create modern web applications.

digital-garden
Digital Garden

A digital garden is a personal, evolving website that shares interconnected ideas and projects.

mdx
MDX

MDX is a format that allows developers to write JSX within Markdown documents, combining the power of React with the simplicity of Markdown. This allows for the creation of dynamic and interactive content that can be easily shared and consumed across different platforms and devices.

prismjs
Prism JS

PrismJS is an open-source, lightweight, and extensible syntax highlighting library that supports a wide range of programming languages and markup formats.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.