Commit ca62693f16e13179a152c450483643089d7cb17b
Make README more approachable
The readme was written hastily prior, and referred to an older version. I changed the overall format so it starts witha directory tour, a path for customization, and _then_ the heavier coding stuff. This is incomplete, as I want it to be suuuper accessible, with each directory having its own README.Zach committed on 7/24/2018, 6:14:53 AM
Parent: 2fd471d37b0b8d35d0e8756c1f4d74adbe41b721
Files changed
| README.md | changed |
| README.md | |||
|---|---|---|---|
| @@ -1,19 +1,58 @@ | |||
| 1 | 1 … | # Dat Zine Library | |
| 2 | 2 … | ||
| 3 | 3 … | It's a zine library for the Chorus! | |
| 4 | 4 … | ||
| 5 … | +**You can see an example library here:** | ||
| 6 … | +`dat://dat-zine-library.hashbase.io` | ||
| 7 … | + | ||
| 8 … | +**To get a personal history, and changelog, for this library code check out: `https://coolguy.website/projects/dat-zine-library` | ||
| 9 … | + | ||
| 10 … | +# Directory Structure | ||
| 11 … | + | ||
| 12 … | +The code is organized around the metaphor of a real-life zine library. So you have all of the zines, the building the zines go in, and the volunteers that perform all the actions that make the whole operation run. | ||
| 13 … | +You also have the identity of this library branch, and what distinguishes it from other zine libraryies. | ||
| 14 … | + | ||
| 15 … | +This repo is laid out the same: | ||
| 16 … | + | ||
| 17 … | +- `branch/`Holds the name and details of this particular library branch. | ||
| 18 … | +- `building/` Holds the HTML and CSS components that make up the library's structure and look. | ||
| 19 … | +- `volunteers/` Holds the core javascript functions that handle when the site is loaded, a zine is added, a zine is edited, etc. | ||
| 20 … | +- `zines/` Holds the zines themselves, each in their own text file. | ||
| 21 … | + | ||
| 22 … | +TODO: Each folder has its own README with more details. | ||
| 23 … | + | ||
| 24 … | +# Customizing the library | ||
| 25 … | + | ||
| 26 … | +If you are the librarian, you can edit any of these files to make your branch your own. The level of customization depends on how much coding you wanna do. | ||
| 27 … | + | ||
| 28 … | +Here's what I recommend: | ||
| 29 … | +- Edit the branch details either by clicking edit in the front-end, or by editing the info.txt file in the `branch/` folder. | ||
| 30 … | +- Remove any zines you don't wanna carry by deleting them from the `zines/` folder. | ||
| 31 … | +- Add new zines either through the front end, or by making a new .txt file in the `zines/` folder. | ||
| 32 … | +- Customize the general look by going to `building/aesthetic/stylesheets/colors-and-fonts.css` | ||
| 33 … | +- Customize the whole styling by going to `building/aesthetic/stylesheets/main.css` | ||
| 34 … | +- Customize the structural code in `building/components` or `volunteers`. This last step will require some more javascript knowledge. | ||
| 35 … | + | ||
| 36 … | + | ||
| 37 … | +The library is built using [choo](https://choo.io). This is a cute framework for building interactive web apps. Their homepage has an awesome tutorial on getting started. To really customize this, though, you'll need to install all required modules and such to your local computer. (see below) | ||
| 38 … | + | ||
| 5 | 39 … | # Installing | |
| 6 | 40 … | ||
| 7 | -First, set up the App: | ||
| 41 … | +The simplest way to install this is to visit the library link in beaker, then fork it and add it to your local directory. | ||
| 42 … | + | ||
| 43 … | +Alternately, you can clone this from gitlab. | ||
| 44 … | +`git clone https://gitlab.com/zachmandeville/dat-zine-library.git` | ||
| 45 … | + | ||
| 46 … | +Then: | ||
| 8 | 47 … | ``` | |
| 9 | -git clone https://gitlab.com/zachmandeville/dat-zine-library.git | ||
| 10 | 48 … | cd dat-zine-library | |
| 11 | 49 … | npm install | |
| 12 | 50 … | npm run build | |
| 13 | 51 … | ``` | |
| 14 | -Then add it to yr BeakerBrowser: | ||
| 15 | 52 … | ||
| 53 … | +If you cloned it from gitlab, you'll need to add this folder to yr BeakerBrowser: | ||
| 54 … | + | ||
| 16 | 55 … | ``` | |
| 17 | 56 … | - Open Beaker | |
| 18 | 57 … | - Click the Hamburger Icon in the top Right | |
| 19 | 58 … | - choose Create New > From Folder | |
| @@ -35,70 +74,7 @@ | |||
| 35 | 74 … | title: name of zine | |
| 36 | 75 … | ---- | |
| 37 | 76 … | url: dat:/ads;lkfajdsgklajglkah3j2kljakhdh32j.sha256 | |
| 38 | 77 … | ``` | |
| 78 … | + | ||
| 39 | 79 … | Click save and you should be good. If not, lemme know! | |
| 40 | 80 … | ||
| 41 | -# Background | ||
| 42 | - | ||
| 43 | -I get really excited about the creative world offered Dat, and Beaker Browser. They (along with Scuttlebutt), are pointing to the place that comes after the web. We call that place The Chorus. This is a tool made exclusively for the Chorus. | ||
| 44 | - | ||
| 45 | -With Dat, anyone can have _abundant_ websites. since there are no server costs, you don't have to think about one central home for your stuff, and you don't have to adjust all the things you make to fit within the limits of the platform or site you are on. Instead, if you wanna make a new thing...you just make a new dat site. This is _really cool_. | ||
| 46 | - | ||
| 47 | -I realized that dat sites can be just like zines. You can make one about whatever you like, fill it with what is important to you at that moment, and then give it out to whoever you want. There is no hierarchy to who can make or read a dat site, and there are no rules for how they should look or what they should be about. | ||
| 48 | - | ||
| 49 | -So if I want a world filled with dat zines, I thought i should try to build a zine library to hold my favorites in. And thus: THIS! | ||
| 50 | - | ||
| 51 | -# WHAT IS THIS? | ||
| 52 | - | ||
| 53 | -It's a tool for you to hold the zines that are important to you, so that others can find them more easily. | ||
| 54 | - | ||
| 55 | -Once you start using this site, it will be _your_ personal library. You can share it with others who can then fork it and build up their libraries too. Then you can share libraries like a good ol' fashioned web ring. | ||
| 56 | - | ||
| 57 | -It also is intended to help build a practice of making dat zines, and a method to signal to other cool solarpunks that you wanna share the zine you just made. | ||
| 58 | - | ||
| 59 | -# HOW DO I USE THIS? WHAT DO YOU MEAN? | ||
| 60 | - | ||
| 61 | -## First: Make a Zine | ||
| 62 | - | ||
| 63 | -To start, you wanna make or find a dat zine. This can be any sort of dat archive that includes a `distro` folder. This folder holds the information you want to make sure is included whenever someone adds yr zine to their library. So inside the distro folder is the cover of your zine and an info.txt file. That file looks something like this: | ||
| 64 | - | ||
| 65 | -``` | ||
| 66 | -title: Fun Baking Time Zine | ||
| 67 | ----- | ||
| 68 | -authors: | ||
| 69 | - - Zach | ||
| 70 | - - Angelica | ||
| 71 | ----- | ||
| 72 | -materials: HTML, CSS, Choo | ||
| 73 | ----- | ||
| 74 | -sharing: Share and fork and modify as you see fit, but please attribute any of these words back to me. | ||
| 75 | ----- | ||
| 76 | -notes: We made this zine as a rainy day project. It ended up taking a week, but it was a rainy week too so it all worked out. | ||
| 77 | - | ||
| 78 | -``` | ||
| 79 | -The cover can be any sorta .jpg, .png, or .gif | ||
| 80 | - | ||
| 81 | -## Add the Zine to yr Library! | ||
| 82 | - | ||
| 83 | -Now, go to your dat-zine-library site, view the files, and navigate yourself to the zine folder. In that folder you'll add a new .txt file called `the-name-of-the-zine.txt` | ||
| 84 | - | ||
| 85 | -That file should look like so: | ||
| 86 | - | ||
| 87 | -``` | ||
| 88 | -// filename is fun-baking-time-zine.txt | ||
| 89 | -title: Fun Baking Time Zine | ||
| 90 | ----- | ||
| 91 | -url: dat:/238r23uotu98329591295j23813j123j.sha256 | ||
| 92 | ----- | ||
| 93 | -notes: | ||
| 94 | -Zach and Angelica gave me this zine the last time we hung out cos I wanted to know how to make Angelica's cinnamon chocolate cookies. | ||
| 95 | -``` | ||
| 96 | - | ||
| 97 | -Then just press save and yr done! | ||
| 98 | - | ||
| 99 | -The dat site will now include this new entry, your notes about it, the cover image, and the relevant info taken from that info.txt file! | ||
| 100 | - | ||
| 101 | - | ||
| 102 | - | ||
| 103 | - | ||
| 104 | - | ||
Built with git-ssb-web