| projects/dat-zine-library/index.htmlView |
|---|
| 1 | 1 … | <!doctype HTML> |
| 2 | 2 … | |
| 3 | 3 … | <html> |
| 4 | | - <head> |
| 5 | | - <title>Dat Zine Library</title> |
| 6 | | - <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
| 7 | | - <meta name="viewport" content = "width=device=width, initial-scale=1"> |
| 8 | | - <meta name='author' content='yr friend and mine Zach Mandeville!'> |
| 9 | | - <meta name='description' content='Making and Holding Zines in the Chorus'> |
| 10 | | - |
| 11 | | - <meta property="og:title" content="Coolguy.Website: Projects | Dat Zine Library." /> |
| 12 | | - <meta property="og:type" content="website" /> |
| 13 | | - <meta name='description' content='Making and Holding Zines in the Chorus'> |
| 14 | | - <meta property="og:image" |
| 15 | | - content="images/zine-library-home.jpg" |
| 16 | | - /> |
| 17 | | - <meta property="og:url" content="https://coolguy.website/" /> |
| 18 | | - |
| 19 | | - <meta name="twitter:card" content="summary_large_image" /> |
| 20 | | - <meta name="twitter:title" content="Coolguy.Website Projects | Dat Zine Library" /> |
| 21 | | - <meta name='twitter:description' content='Making and holding Zines for the Chorus'> |
| 22 | | - <meta name="twitter:image" |
| 23 | | - content="images/zine-library-home.jpg" |
| 24 | | - /> |
| 25 | | - |
| 26 | | - <link rel="stylesheet" type="text/css" href="../../styles/main.css"> |
| 27 | | - <link rel='stylesheet' type='text/css' href='../../styles/colors.css'> |
| 28 | | - <link rel='stylesheet' type='text/css' href='../../styles/projects.css'> |
| 29 | | - </head> |
| 30 | | - <body> |
| 31 | | - <header id ='coordinates'> |
| 32 | | - <p class="breadcrumb"> you are viewing a project of <a href="../index.html" |
| 33 | | - title="coolguy.website">Coolguy.Website</a>. Go back <a href="../index.html" title="coolguy.website">to Projects</a></p> |
| 34 | | - </header> |
| 35 | | - <article> |
| 36 | | - <h1 id='project-name'><a href='#'>Dat Zine Library</a></h1> |
| 37 | | - <div id='project'> |
| 38 | | - <ul class='project-links'> |
| 39 | | - <li><a href='#changelog'>Changelog</a></li> |
| 40 | | - <li><a href='#origin-story'>Origin Story</a></li> |
| 41 | | - <li><a href='#how-it-works'>How It Works</a></li> |
| 42 | | - <li><a href='https://gitlab.com/zachmandeville/dat-zine-library' title='gitlab repo' target='blank'>Gitlab Repo</a></li> |
| 43 | | - <li><a href='dat://dat-zine-library.hashbase.io/' title='example library' target='blank'>My Zine Library</a></li> |
| 44 | | - </ul> |
| 4 … | + <head> |
| 5 … | + <title>Dat Zine Library</title> |
| 6 … | + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
| 7 … | + <meta name="viewport" content = "width=device=width, initial-scale=1"> |
| 8 … | + <meta name='author' content='yr friend and mine Zach Mandeville!'> |
| 9 … | + <meta name='description' content='Making and Holding Zines in the Chorus'> |
| 10 … | + |
| 11 … | + <meta property="og:title" content="Coolguy.Website: Projects | Dat Zine Library." /> |
| 12 … | + <meta property="og:type" content="website" /> |
| 13 … | + <meta name='description' content='Making and Holding Zines in the Chorus'> |
| 14 … | + <meta property="og:image" |
| 15 … | + content="images/zine-library-home.jpg" |
| 16 … | + /> |
| 17 … | + <meta property="og:url" content="https://coolguy.website/" /> |
| 18 … | + |
| 19 … | + <meta name="twitter:card" content="summary_large_image" /> |
| 20 … | + <meta name="twitter:title" content="Coolguy.Website Projects | Dat Zine Library" /> |
| 21 … | + <meta name='twitter:description' content='Making and holding Zines for the Chorus'> |
| 22 … | + <meta name="twitter:image" |
| 23 … | + content="images/zine-library-home.jpg" |
| 24 … | + /> |
| 25 … | + |
| 26 … | + <link rel="stylesheet" type="text/css" href="../../styles/main.css"> |
| 27 … | + <link rel='stylesheet' type='text/css' href='../../styles/colors.css'> |
| 28 … | + <link rel='stylesheet' type='text/css' href='../../styles/projects.css'> |
| 29 … | + </head> |
| 30 … | + <body> |
| 31 … | + <header id ='coordinates'> |
| 32 … | + <p class="breadcrumb"> you are viewing a project of <a href="../index.html" |
| 33 … | + title="coolguy.website">Coolguy.Website</a>. Go back <a href="../index.html" title="coolguy.website">to Projects</a></p> |
| 34 … | + </header> |
| 35 … | + <article> |
| 36 … | + <h1 id='project-name'><a href='#'>Dat Zine Library</a></h1> |
| 37 … | + <div id='project'> |
| 38 … | + <ul class='project-links'> |
| 39 … | + <li><a href='#changelog'>Changelog</a></li> |
| 40 … | + <li><a href='#origin-story'>Origin Story</a></li> |
| 41 … | + <li><a href='#how-it-works'>How It Works</a></li> |
| 42 … | + <li><a href='https://gitlab.com/zachmandeville/dat-zine-library' title='gitlab repo' target='blank'>Gitlab Repo</a></li> |
| 43 … | + <li><a href='dat://dat-zine-library.hashbase.io/' title='example library' target='blank'>My Zine Library</a></li> |
| 44 … | + </ul> |
| 45 | 45 … | |
| 46 | | - <div id='summary'> |
| 47 | | - <p>A tool for curating and sharing your favorite dat zines. It's designed to be reproduced by other eager librarians, so there can be multiple librarians with branches all finding, sharing, and creating dat zines and, in the process, finding each other and maybe...just maybe...finding themselves?</p> |
| 48 | | - <p>Dat zines are an emerging medium that arose <em>with</em> this library and the Chorus. And so the library is a sort of invocation, in the way a well-organized backpack and pen bag is an invocation for a successful school year, or a bravely sent text asking about the weekend is an invocation to love. I want the Chorus to be filled with art and zines. This library is an invocation to create the things that go inside it.</p> |
| 49 | | - </div> |
| 46 … | + <div id='summary'> |
| 47 … | + <p>A tool for curating and sharing your favorite dat zines. It's designed to be reproduced by other eager librarians, so there can be multiple librarians with branches all finding, sharing, and creating dat zines and, in the process, finding each other and maybe...just maybe...finding themselves?</p> |
| 48 … | + <p>Dat zines are an emerging medium that arose <em>with</em> this library and the Chorus. And so the library is a sort of invocation, in the way a well-organized backpack and pen bag is an invocation for a successful school year, or a bravely sent text asking about the weekend is an invocation to love. I want the Chorus to be filled with art and zines. This library is an invocation to create the things that go inside it.</p> |
| 49 … | + </div> |
| 50 | 50 … | |
| 51 | | - <section id='origin-story'> |
| 52 | | - <h1>Origin Story</h1> |
| 53 | | - <p>I have been fed, inspired, and formed by independent DIY culture. A large portion of my beliefs can be traced back to some zine, song lyric, comic panel, or house show (the remainder of my beliefs come from Judy Blume novels and various epiphanic moments beneath trees, rainstorms, stars, etc). </p> |
| 54 | | - <p>Along with every other gross thing caused by the current style of the web, one of the most personally terrible for me is the atrophy of independent culture. People are still being wonderful and creative and alive today, but they are also so <em>tired</em>. Artists quit at the height of creativity because they are worn out, and it's not being worn out from touring and excess or some such. It's the wearing out that happens when you have to constantly promote yourself to algorithms that don't care about you. There's so much energy being drained by 'the internet', but the support structures that were present in independent culture are being replaced by weak digital fascimiles, and it's becoming harder for artists to help each other or find a way out.</p> |
| 55 | | - <p>This feeling that the web is working against us is larger than just diy circles. Because of this, there's a lot of work being done by really cool people to offer an alternative to the web. This alternative is decentralized, not reliant on any central server like google to operate, and it is being designed to undermine and dissolve oppressive systems like facebook (and the state). The future I want is decentralized, consensual, anarchist, feminist, and cool--and luckily this is being built right now, a new space different from the web that I lovingly call the Chorus.</p> |
| 56 | | - <p>I wanted to help contribute to the Chorus, using the little bit of code I know and the lotta bit of heart I have. And I wanted to do so using the style I grew up in, and so I am trying to foster punk and zine culture in this new future space. You can check out the first library (and create your own!) here:<br>dat://dat-zine-library.hashbase.io<br>(This requires the beaker browser to view, but you can download it <a href="https://beakerbrowser.com">here</a>.)</p> |
| 57 | | - <p>That's the basic origin story. If you wanna know about my intentions and feeeeeelings about tech today, then read on baybeee!</p> |
| 58 | | - <h1 id="my-intentions">My Intentions</h1> |
| 59 | | - <p>I wanted to avoid a tendency I see so much in new technology or platforms, which could be called 'the DuPont, WA problem'. To explain this, I gotta tell you a bit about the town of Dupont, Washington and my feelings for it. And so...</p> |
| 60 | | - <h2 id="a-quick-shitting-upon-the-town-of-dupont-washington">A QUICK SHITTING UPON THE TOWN OF DUPONT WASHINGTON</h2> |
| 61 | | - <p>I grew up in the town of Funwater, Washington- a rural, magical, college town about an hour south of Seattle. Dupont was a newer city about 20 minutes north of me. It was a small town that had been rebuilt by Intel as a place to house its employees, and then modified by the local military base to hold its soldiers and their families. The town was almost entirely artificial, a perfectly designed vision of an ideal American town. This design made it so DuPont was boring as heeeeeeellllll.</p> |
| 62 | | - <p>I spent a decent amount of time there, I don't wanna be some snob shitting upon towns they merely pass on the freeway. My brother and his family lived there, and my parents loved eating at the 'Irish' pub in the 'downtown'. There was a lot of desire in the town to be nice, but it was still just soulless and boring. Everywhere was easy to get to, the sidewalks were all wide and walkable, the street signs clearly marked, each intersection a roundabout and ample parking everywhere. It had everything necessary to be a city, except for culture and heart.</p> |
| 63 | | - <p>A downtown was built for Dupont, with a bunch of empty spaces advertising how great a location the city would be. Soon after, a bunch of chain and franchise businesses opened in these spaces, since there was no real local culture to rise up there instead. So the downtown had an illusion of life, but it was really an anonymous stripmall. </p> |
| 64 | | - <h2 id="where-are-you-going-with-this-">WHERE ARE YOU GOING WITH THIS?</h2> |
| 65 | | - <p>There's this tendency with a lot of technologists who want an alternative to the gross platforms of twitter and facebook, so they build a <em>new</em> platform, with a more noble mission statement, and hope the cool people arrive. Because it's a platform for people to interact in, the new thing isn't really <em>a thing</em> until enough people are on it, so then the developers spend all their time trying to make their new site super easy to get to, super easy to get signed up for, with little addictive tricks to try to keep people engaged. In other words, they're building all these onboarding ramps and roundabouts and lit up street signs to show that they are a real town that you can build home in. </p> |
| 66 | | - <p>The problem with this is it still puts so much labor on the users to make this thing cool, without giving the users any actual power. Someone wants something better than twitter, so they try out this new site called peach.cool or imzy.com or ello.co or steemit.io or whatever. And the splash page for the site is wonderful, and the mobile app is slick with super happy messages, but then they get inside and it's just an empty place with maybe a few users trying to self-promote their new blog. If they want their new online home to be interesting, they have to start petitioning all their friends to come over. Since there is nothing in this new space yet, it's hard to make it sound appealing. It's like someone trying to get their friends to move with them to DuPont, with the appealing "All the houses are super close to a freeway entrance, and there's a grocery store with front and <em>back</em> parking. Oh and you <em>know</em> we have a Starbucks, within driving distance!" </p> |
| 67 | | - <p>Ultimately, the new platform shuts down, since it was ultimately a business with a business model reliant on have as many people as possible. The tiny early crew was not enough, and they now have to find some other home or go back to their old ways.</p> |
| 68 | | - <p>This is a 'Bad Model'. It doesn't make people's days easier, it doesn't make people less tired and more happy--and it just creates a string of digital ghost towns, web pages built like Dupont Washington. These platforms are exhausting for artists too, as they now need to promote their own work <em>and</em> promote this new web platform, but there's nothing really to distinguish this platform because it was designed to be familiar but 'better intentioned'.</p> |
| 69 | | - <p>If we want something that is actually different, then let's not make comfortable, familiar shit built for addictive convenience that is boring and condescending and ultimately identical to what came before. Let's stop making high-tech versions of Applebee's.</p> |
| 70 | | - <p>I don't want to code an Applebee's, and I don't wanna help create a digital DuPont. I much prefer the isolated smalltown punk scene method. Don't build for the masses with the goal to be the next dominant force. Instead, make cool things for your friends to enjoy, and help them build cool things too. Work with what you have, to support the people around you and together you'll create a community that has a defined shape and form only in hindsight. Instead of worrying about having enough onboarding ramps, I say we make a future space that is so exciting, so fun, that is such a cool party with lights so bright that everyone wants to build their <em>own</em> methods to get here and join in.</p> |
| 71 | | - <p>And I thought: what's the coolest, most party thing in the world?</p> |
| 72 | | - <p>Reading.</p> |
| 73 | | - <h1 id="dat-zine-library">Dat Zine Library</h1> |
| 74 | | - <p>Dat and Beaker are two major elements of the Chorus. Dat is a protocol (similar to http on the web) that lets you create and host a webpage straight from your computer. <a href="https://beakerbrowser.com">Beaker</a> is a browser designed for dat, it helps you make your own dat sites along with viewing and supporting the works of your friends.</p> |
| 75 | | - <p>Coding your own web page, even with the simplest 1997 geocities html, is one of the most powerful and liberating feelings. I cannot recommend it enough. But hosting the web page so others can see it can be mad time-intensive or money-intensive. This is a bigger hurdle than learning the code. Beaker and dat eliminate this hurdle. In the Chorus, your computer and your friends' computers are the host, and writing and sharing a thing can be folded into a single act.</p> |
| 76 | | - <p>This means the only entrance fee to having a site up is having access to a computer and internet connection. There is no hosting heirarchy or contortion you have to go through to fit some other publishing platform. And with this, it means you don't have to make just a single webpage. It's easy to make a <em>bunch</em> of dat sites, each centered around whatever subject you'd like.</p> |
| 77 | | - <p>There is no implicit way to discover dat sites--instead you have to share your link with friends and hope they support, seed, and share the link too. A dat site spreads, then, through classic, social and 'underground' channels. </p> |
| 78 | | - <p>These things combined made a datsite feel far closer to a zine than a webpage. There is no hierarchy to who can write them or publish them. There is no strict definition for what they should look like or what they should be about. And to visit a dat site, much like reading a zine, requires that you ask for it from the creator of it (or be a part of a culture that is supporting and sharing them).</p> |
| 79 | | - <p>Also, dat sites have an ability to be copied by any of the visitors to the site. If you make them the right way, then your dat site can be both a thing to be enjoyed and an instruction manual on how to make one yourself. This dual-purpose is the heart of what I love so much about zines and punk culture. It is hard to be passive in a punk scene, everything is inviting you to join in in whatever way you can.</p> |
| 80 | | - <h2 id="making-dat-zines">Making Dat Zines</h2> |
| 81 | | - <p>This got me really excited, and so I wanted to start making small dat sites that emphasized this independent spirit. Each site has a different codebase, different subject, and different look--but they are connected by a shared standard in their file structure. Each page has a distro folder which holds instructions for distribution, which holds the author's intentions however they want to state them.</p> |
| 82 | | - <p>I wanted to have a way to gather the zines I made or found and wanted others to share: what would traditionally be a distro or a zine library. Since I was not selling these, and wasn't also selling like tapes and pins and such, a distro wasn't the right fit. So I coded up a dat Zine library. </p> |
| 83 | | - <h2 id="dat-library-spirit">Dat Library Spirit</h2> |
| 84 | | - <p>To be clear: this is not a platform. This is a tool and a suggestion of spirit. The first dat zine library is here: dat://dat-zine-library.hashbase.io. It is my personal library, but you can copy it with a button click and have your own personal library too. My library is filled with the zines I created, ones that my friends made, or ones that were shared with me that I liked. Yours can be filled with whatever you want, in as wide of subject matter or as specific as you want. The core intention of the zine library is to excite you, the visitor, enough that you want to make a zine yourself and then to find enough examples for how to do so. </p> |
| 85 | | - <p>My dream, is to have people inspired to make webpages again about whatever they'd like, and share them in ways that don't promote competitive, addictive 'engagement stats'. And to have cyber-regional zine libraries that are collecting and supporting different scenes' work. That may come in the future. For now, I have a small set of nice things that I made with friends, and a place where I can make more cool things with these friends. </p> |
| 86 | | - <p>The Chorus offers a new way to support a thriving independent culture again, one made by and for artists and their communities--- These dat-zines are my personal expression of how that could look.</p> |
| 87 | | - <h1 id="that-was-some-grand-talk-bring-it-down-with-some-honesty-">That was some grand talk! Bring it Down with some Honesty!</h1> |
| 88 | | - <p>I have a hard time containing enthusiasm. This can be annoying, because it means when I enjoy a thing it's hard to suppress the urge to recommend this thing to everyone else too, saying this thing 'is the most important change the world has ever seen'. I did it with the movie Pacific Rim, I did it with boardgames, I did it with the dish 'vegetable curry with roti'. I'm probably doing it now with this page.</p> |
| 89 | | - <p>But to be honest, I made the library, and these initial zines, as a personal act to get out of a depression. Writing zines was a huge part of my life and identity, but I lost the spirit for it when I tried to move the work online. The act of promoting, and legitimacy, was mad distracting. I was concerned far more with page stats of my blog, or the performance of a fb post or tweet, then any new work. Which was silly, because I started a blog and twitter account because I thought I needed both to promote my work. I am not saying this is the same for everyone, but just how my head works. When a site is designed to notify me with how well I'm doing, or how popular I am, I become discouraged by the concept of both and immediately want to disappear taking all my work with me. It's worse when the site is holding all my creativity, and needs my engagement to survive and continue to preserve my work, and so I have to actively engage with the worst parts of my head so the best parts can persist. </p> |
| 90 | | - <p>I love making things, and sharing things, and knowing that something I made resonated with someone else. I wanted to figure out a way to do this that didn't throw me down a bad spiral. Coding up dat sites brought back an energy I missed for a v. long time, and I wanted to share that with you.</p> |
| 91 | | - </section> |
| 51 … | + <section id='origin-story'> |
| 52 … | + <h1>Origin Story</h1> |
| 53 … | + <p>I have been fed, inspired, and formed by independent DIY culture. A large portion of my beliefs can be traced back to some zine, song lyric, comic panel, or house show (the remainder of my beliefs come from Judy Blume novels and various epiphanic moments beneath trees, rainstorms, stars, etc). </p> |
| 54 … | + <p>Along with every other gross thing caused by the current style of the web, one of the most personally terrible for me is the atrophy of independent culture. People are still being wonderful and creative and alive today, but they are also so <em>tired</em>. Artists quit at the height of creativity because they are worn out, and it's not being worn out from touring and excess or some such. It's the wearing out that happens when you have to constantly promote yourself to algorithms that don't care about you. There's so much energy being drained by 'the internet', but the support structures that were present in independent culture are being replaced by weak digital fascimiles, and it's becoming harder for artists to help each other or find a way out.</p> |
| 55 … | + <p>This feeling that the web is working against us is larger than just diy circles. Because of this, there's a lot of work being done by really cool people to offer an alternative to the web. This alternative is decentralized, not reliant on any central server like google to operate, and it is being designed to undermine and dissolve oppressive systems like facebook (and the state). The future I want is decentralized, consensual, anarchist, feminist, and cool--and luckily this is being built right now, a new space different from the web that I lovingly call the Chorus.</p> |
| 56 … | + <p>I wanted to help contribute to the Chorus, using the little bit of code I know and the lotta bit of heart I have. And I wanted to do so using the style I grew up in, and so I am trying to foster punk and zine culture in this new future space. You can check out the first library (and create your own!) here:<br>dat://dat-zine-library.hashbase.io<br>(This requires the beaker browser to view, but you can download it <a href="https://beakerbrowser.com">here</a>.)</p> |
| 57 … | + <p>That's the basic origin story. If you wanna know about my intentions and feeeeeelings about tech today, then read on baybeee!</p> |
| 58 … | + <h1 id="my-intentions">My Intentions</h1> |
| 59 … | + <p>I wanted to avoid a tendency I see so much in new technology or platforms, which could be called 'the DuPont, WA problem'. To explain this, I gotta tell you a bit about the town of Dupont, Washington and my feelings for it. And so...</p> |
| 60 … | + <h2 id="a-quick-shitting-upon-the-town-of-dupont-washington">A QUICK SHITTING UPON THE TOWN OF DUPONT WASHINGTON</h2> |
| 61 … | + <p>I grew up in the town of Funwater, Washington- a rural, magical, college town about an hour south of Seattle. Dupont was a newer city about 20 minutes north of me. It was a small town that had been rebuilt by Intel as a place to house its employees, and then modified by the local military base to hold its soldiers and their families. The town was almost entirely artificial, a perfectly designed vision of an ideal American town. This design made it so DuPont was boring as heeeeeeellllll.</p> |
| 62 … | + <p>I spent a decent amount of time there, I don't wanna be some snob shitting upon towns they merely pass on the freeway. My brother and his family lived there, and my parents loved eating at the 'Irish' pub in the 'downtown'. There was a lot of desire in the town to be nice, but it was still just soulless and boring. Everywhere was easy to get to, the sidewalks were all wide and walkable, the street signs clearly marked, each intersection a roundabout and ample parking everywhere. It had everything necessary to be a city, except for culture and heart.</p> |
| 63 … | + <p>A downtown was built for Dupont, with a bunch of empty spaces advertising how great a location the city would be. Soon after, a bunch of chain and franchise businesses opened in these spaces, since there was no real local culture to rise up instead. So the downtown had an illusion of life, but it was really an anonymous stripmall. </p> |
| 64 … | + <h2 id="where-are-you-going-with-this-">WHERE ARE YOU GOING WITH THIS?</h2> |
| 65 … | + <p>There's this tendency with a lot of technologists where they want an alternative |
| 66 … | + to the gross platforms of twitter and facebook, so they build a <em>new</em> platform, |
| 67 … | + with a more noble mission statement, and hope the cool people arrive. Because it's a |
| 68 … | + platform for people to interact in, the new thing isn't really <em>a thing</em> until |
| 69 … | + enough people are on it, so then the developers spend all their time trying to make their |
| 70 … | + new site super easy to get to, super easy to get signed up for, with little addictive |
| 71 … | + tricks to try to keep people engaged. In other words, they're building all these |
| 72 … | + onboarding ramps and roundabouts and lit up street signs to show that they are a real town |
| 73 … | + that you can build a home in. </p> |
| 74 … | + <p>The problem with this is it still puts so much labor on the users to make this thing |
| 75 … | + cool, without giving the users any actual power. Someone wants something better than |
| 76 … | + twitter, so they try out this new site called peach.cool or imzy.com or ello.co or |
| 77 … | + steemit.io or whatever. And the splash page for the site is wonderful, and the mobile app |
| 78 … | + is slick with super happy messages, but then they get inside and it's just an empty |
| 79 … | + place with maybe a few users trying to self-promote their new blog. If they want their |
| 80 … | + new online home to be interesting, they have to start petitioning all their friends to |
| 81 … | + come over. Since there is nothing in this new space yet, it's hard to make it sound |
| 82 … | + appealing. It's like someone trying to get their friends to move with them to DuPont, |
| 83 … | + by saying "All the houses are super close to a freeway entrance, and there's a grocery store with front and <em>back</em> parking. Oh and you <em>know</em> we have a Starbucks, within driving distance!" </p> |
| 84 … | + <p>Ultimately, the new platform shuts down, since its business model relied on having as |
| 85 … | + many people as possible. The tiny early crew was not enough, and that crew has to find some other home or go back to their old ways.</p> |
| 86 … | + <p>This is a 'Bad Model'. It doesn't make people's days easier, it |
| 87 … | + doesn't make people less tired and more happy--and it just creates a string of digital |
| 88 … | + ghost towns, web pages built like Dupont Washington. These platforms are exhausting for |
| 89 … | + artists, as they now need to promote their own work <em>and</em> promote the platform, but there's nothing really to distinguish this platform because it was designed to be familiar but 'better intentioned'.</p> |
| 90 … | + <p>If we want something that is actually different, then let's not make comfortable, familiar shit built for addictive convenience that is boring and condescending and ultimately identical to what came before. Let's stop making high-tech versions of Applebee's.</p> |
| 91 … | + <p>I don't want to code an Applebee's, and I don't wanna help create a digital |
| 92 … | + DuPont. I much prefer the method of the isolated smalltown punk scene. Don't build for the masses with the goal to be the next dominant force. Instead, make cool things for your friends to enjoy, and help them build cool things too. Work with what you have, to support the people around you and together you'll create a community that has a defined shape and form only in hindsight. Instead of worrying about having enough onboarding ramps, I say we make a future space that is so exciting, so fun, that is such a cool party with lights so bright that everyone wants to build their <em>own</em> methods to get here and join in.</p> |
| 93 … | + <p>And I thought: what's the coolest, most party thing in the world?</p> |
| 94 … | + <p>Reading.</p> |
| 95 … | + <h1 id="dat-zine-library">Dat Zine Library</h1> |
| 96 … | + <p>Dat and Beaker are two major elements of the Chorus. Dat is a protocol (similar to http on the web) that lets you create and host a webpage straight from your computer. <a href="https://beakerbrowser.com">Beaker</a> is a browser designed for dat, it helps you make your own dat sites along with viewing and supporting the works of your friends.</p> |
| 97 … | + <p>Coding your own web page, even with the simplest 1997 geocities html, is one of the most powerful and liberating feelings. I cannot recommend it enough. But hosting the web page so others can see it can be mad time-intensive or money-intensive. This is a bigger hurdle than learning the code. Beaker and dat eliminate this hurdle. In the Chorus, your computer and your friends' computers are the host, and writing and sharing a thing can be folded into a single act.</p> |
| 98 … | + <p>This means the only entrance fee to having a site up is having access to a computer and internet connection. There is no hosting heirarchy or contortion you have to go through to fit some other publishing platform. And with this, it means you don't have to make just a single webpage. It's easy to make a <em>bunch</em> of dat sites, each centered around whatever subject you'd like.</p> |
| 99 … | + <p>There is no implicit way to discover dat sites--instead you have to share your link with friends and hope they support, seed, and share the link too. A dat site spreads, then, through classic, social and 'underground' channels. </p> |
| 100 … | + <p>These things combined made a datsite feel far closer to a zine than a webpage. There is no hierarchy to who can write them or publish them. There is no strict definition for what they should look like or what they should be about. And to visit a dat site, much like reading a zine, requires that you ask for it from the creator of it (or be a part of a culture that is supporting and sharing them).</p> |
| 101 … | + <p>Also, dat sites have an ability to be copied by any of the visitors to the site. If you make them the right way, then your dat site can be both a thing to be enjoyed and an instruction manual on how to make one yourself. This dual-purpose is the heart of what I love so much about zines and punk culture. It is hard to be passive in a punk scene, everything is inviting you to join in in whatever way you can.</p> |
| 102 … | + <h2 id="making-dat-zines">Making Dat Zines</h2> |
| 103 … | + <p>This got me really excited, and so I wanted to start making small dat sites that |
| 104 … | + emphasized this independent spirit. Each site has a different codebase, different subject, |
| 105 … | + and different look--but they are connected by a shared standard in their file structure. |
| 106 … | + Each page has a distro folder which holds instructions for distribution, and can state the |
| 107 … | + author's intentions and background.</p> |
| 108 … | + <p>I wanted to have a way to gather the zines I made or found and wanted others to share: what would traditionally be a distro or a zine library. Since I was not selling these, and wasn't also selling like tapes and pins and such, a distro wasn't the right fit. So I coded up a dat Zine library. </p> |
| 109 … | + <h2 id="dat-library-spirit">Dat Library Spirit</h2> |
| 110 … | + <p>To be clear: this is not a platform. This is a tool and a suggestion of spirit. The first dat zine library is here: dat://dat-zine-library.hashbase.io. It is my personal library, but you can copy it with a button click and have your own personal library too. My library is filled with the zines I created, ones that my friends made, or ones that were shared with me that I liked. Yours can be filled with whatever you want, in as wide of subject matter or as specific as you want. The core intention of the zine library is to excite you, the visitor, enough that you want to make a zine yourself and then to find enough examples for how to do so. </p> |
| 111 … | + <p>My dream is to have people inspired to make webpages again about whatever they'd like, and share them in ways that don't promote competitive, addictive 'engagement stats'. And to have cyber-regional zine libraries that are collecting and supporting different scenes' work. That may come in the future. For now, I have a small set of nice things that I made with friends, and a place where I can make more cool things with these friends. </p> |
| 112 … | + <p>The Chorus offers a new way to support a thriving independent culture again, one made by and for artists and their communities--- These dat-zines are my personal expression of how that could look.</p> |
| 113 … | + <h1 id="that-was-some-grand-talk-bring-it-down-with-some-honesty-">That was some grand talk! Bring it Down with some Honesty!</h1> |
| 114 … | + <p>I have a hard time containing enthusiasm. This can be annoying, because it means when I enjoy a thing it's hard to suppress the urge to recommend this thing to everyone else too, saying this thing 'is the most important change the world has ever seen'. I did it with the movie Pacific Rim, I did it with boardgames, I did it with the dish 'vegetable curry with roti'. I'm probably doing it now with this page.</p> |
| 115 … | + <p>But to be honest, I made the library, and these initial zines, as a personal act to get |
| 116 … | + out of a depression. Writing zines was a huge part of my life and identity, but I lost |
| 117 … | + the spirit for it when I tried to move the work online. The act of promoting, and |
| 118 … | + legitimacy, was mad distracting. I was concerned far more with page stats of my blog, or |
| 119 … | + the performance of a fb post or tweet, then any new work. Which was silly, because I |
| 120 … | + started a blog and twitter account because I thought I needed both to promote my work. I |
| 121 … | + am not saying this is the same for everyone, but just how my head works. When a site is |
| 122 … | + designed to notify me with how well I'm doing, or how popular I am, I become |
| 123 … | + discouraged by the concept of both and immediately want to disappear-- taking all my work |
| 124 … | + with me. It's worse when the site holds all the products of my creativity, and needs |
| 125 … | + my engagement to surive so it can continue to hold my work. This means I have to actively |
| 126 … | + engage with the worst parts of my head just so the best parts can persist.</p> |
| 127 … | + <p>I love making things, and sharing things, and knowing that something I made resonated with someone else. I wanted to figure out a way to do this that didn't throw me down a bad spiral. Coding up dat sites brought back an energy I missed for a v. long time, and I wanted to share that with you.</p> |
| 128 … | + </section> |
| 92 | 129 … | |
| 93 | | - <section id='how-it-works'> |
| 94 | | - <h1>How it Works</h1> |
| 95 | | - <p>The Dat Zine Library is a lot like the comic strip Heathcliff, in that it works on many levels. You can enjoy the library as a patron, as a zinester making a submission, as a librarian tending to a branch, or as a librarian hacker spinning up their own version. I'll try to lightly guide through each scenario!</p> |
| 96 | | - <h1 id="a-word-at-the-start">A Word at the Start</h1> |
| 97 | | - <p> this is a tool of the <em>*~~future~~* </em>, and no matter how you interact with it you'll want to know some future tools and terms, as I'll likely be using them throughout here.</p> |
| 98 | | - <h2 id="future-terms">FUTURE TERMS</h2> |
| 99 | | - <ul id='terms'> |
| 100 | | - <li><strong>The Chorus</strong>: This is the place in which the zine library resides, instead of 'the web'. The Chorus is a space of radical, punk2punk art and software that aims to help build our solarpunk future. It's decentralized, so everything can be done through the community without relying on any central server or authority. Every member of the zine community is an integral part of the digital infrastructure, and your support of a zine in the Chorus directly helps the entire infrastructure.</li> |
| 101 | | - <li><strong>A Zine</strong>: A mix between a love letter and a book. Zines have a loooose definition, cos their power cannot be contained, but generally they are self-published pamphlets that are distributed through a network of friends, cool librarians, and punks. They can be about whatever you want, and look however you want. </li> |
| 102 | | - <li><strong>A Dat Zine</strong>: A mix between a zine and a website. These are self-published dat sites that are distributed through a network of friends, cool dat zine librarians, and solarpunks across the Chorus. They can be whatever you want, coded however you feel comfortable coding, and look however you want. They don't need to be text-based. A cool coded rhythm game could be a dat zine if the spirit is right.</li> |
| 103 | | - <li><strong>Dat</strong>: A protocol for sharing sites, files, and apps in a distributed, decentralized way. It is similar to http, which is the protocol the web uses for sharing web pages. But in the web, pages are held on servers that are then accessed by the site visitors. With Dat, the pages are held on the devices in which they were written, along with the device of every visitor and peer who chooses to seed that site. In this way, there is no central server controlling access, the content lives among the community itself. It is kind of like how torrents work, and kind of like how the web could've worked, but different than both. Because it's a separate protocol from the web, most browsers (like chrome or safari) cannot view a dat zine. There is a new browser, called Beaker Browser, that can view dat sites <em>and</em> create them.</li> |
| 104 | | - <li><strong>swingin' on the flippity flop</strong>: A slang term for 'hanging out'.</li> |
| 105 | | - <li><strong>Beaker Browser:</strong> A web browser for the Chorus. It can be downloaded at <a href="https://beakerbrowser.com">beakerbrowser.com</a>. It can be used to browser the normal web, but can also view dat sites and dat zines. In addition, it has editing and publishing capabilities built in, so you can create your own dat zine from within the browser. </li> |
| 106 | | - <li><strong>Seeding</strong>: A technical method of support. Since the zinester who made the dat zine also acts as the 'server' hosting the zine, the zine may not be accessible if their computer isn't on and Beaker isn't running. You can support their work by clicking the seed option on the beaker browser, which turns your browser into a server for this zine too. Now people can access the zine from either of you. As a zine grows in readership, it also grows in reliance and availability and you can show support to the author in a directly felt and appreciated way, that isn't just monetary.</li> |
| 107 | | - <li><strong>Forking</strong>: An integral, revolutionary part of Dat, Beaker, and the Chorus. Forking means to make a copy of all the files that make up a dat zine, but this copy you have 'write access' to. In other words, make your own copy that you can edit in any way you please. All dat zines can be forked, which means you can be inspired by someone's work, and make a new zine based off their structure. In fact, many of the existing dat zines act as both a zine and an instruction manual for making zines. In the same way, the library can be forked so you have your own branch and you can change up the collection however you please.</li> |
| 108 | | - <li><strong>HTML/CSS/Javascript</strong>: The paper, sharpie, gluestick and scissors for Dat Zines. There is no expertise level required to make a zine. You can do it with the most basic html that you've gathered from old geocities pages. If you want to make a dat zine, but have not coded at all before and feel intimidated, feel free to <a href="mailto:webmaster@coolguy.website">email me</a> and I'd be happy to help where I can!</li> |
| 109 | | - <li><strong>Scuttlebutt</strong>: sea-slang for 'gossip', but also the solarpunk community/protocol of our beautiful future. Scuttlebutt is an incredible way to discover dat zines and talk to other zinesters about it. You can learn more at <a href="https://scuttlebutt.nz">scuttlebutt.nz</a></li> |
| 110 | | - <li><strong>Text Editor</strong>: Literally a program to edit text, but usually refers to one that's meant for writing code of any sort. You will use a text editor to write up your zines. The beta version of beaker has one built in. There are also free text editors available that are mad useful. <a href="https://atom.io/">Atom</a> is a good one, as is <a href="https://www.vim.org/">Vim</a>. (<em>note: Vim has a bit of a learning curve, but it's a beautiful one and can be a life-changing experience. I fuck with Vim.</em>)</li> |
| 111 | | - <li><strong>Command Line or Terminal</strong>: The sacred well hidden beneath the ornate cathedral of your computer. The terminal is available on all Mac and Linux computers, and can be emulated on windows. It's an entirely different way of interacting with and talking to your computer, coming from a more radical and beautiful past. Using the command line can be strange at first, but is incredibly empowering and lets you discover new tools and methods that are hidden away on your device. You likely won't have to use it as just a zine fan, but it's mass recommended when you become a hacker librarian.</li> |
| 112 | | - </ul> |
| 113 | | - <p>Alright, them's the terms lets get to some teachings!</p> |
| 114 | | - <h1 id="visiting-the-library-and-reading-a-zine-">Visiting the Library and Reading a zine!</h1> |
| 115 | | - <p>To get to the library, you will need to download and install beaker browser. You can find instructions for that here: <a href="https://beakerbrowser.com/install/">https://beakerbrowser.com/install/</a></p> |
| 116 | | - <p>Once you have it up and running visit this site:<br><strong>dat://dat-zine-library.hashbase.io</strong></p> |
| 117 | | - <p>Here you'll find all the zines I've written or collected. When you click on the cover for one, you'll be brought to that zine in a new URL. </p> |
| 118 | | - <p>If you click on it, and nothing shows up, that's likely because I forgot to seed the site, and the zinester is not online at the moment and thus the zine is not accessible. Check back again in a bit, and it'd likely be up!</p> |
| 119 | | - <h2 id="good-etiquette">Good Etiquette</h2> |
| 120 | | - <p>If you like a zine, click the three connected dots in beaker's address bar and choose a seeding option:<br><img src="images/seeding-a-dat-zine.gif" alt="gif showing how to seed a dat zine"></p> |
| 121 | | - <p>This supports the creator by helping make it available for everyone else, reducing their hosting burden. Similarly, if you like my zine library, please seed it too!</p> |
| 122 | | - <h1 id="making-your-own-zine-">Making your own Zine!</h1> |
| 123 | | - <p>There's a few ways to go about this. You can either start from an existing dat zine, especially one intended to work as a template, or you can make it entirely from scratch.</p> |
| 124 | | - <p>There's no right way to code a zine, and there's no specific format for it. There is a unifying standard <em>folder</em> though, that marks that specific dat site as a <em>ziiine</em>. It is the <strong>distro</strong> folder.</p> |
| 125 | | - <p>The distro folder has two files:</p> |
| 126 | | - <ul> |
| 127 | | - <li>cover.jpg (or cover.png or cover.gif)</li> |
| 128 | | - <li>info.txt</li> |
| 129 | | - </ul> |
| 130 | | - <p>The image you name as the cover will be used in zine libraries as your cover. The info.txt file contains any information you want people to know about yr zine, and it's displayed at hte bottom of yr zine card in the library. It's a good spot to put the author, the creation date, sharing requests, the music you listened to during the creation of the zine, and so on.</p> |
| 131 | | - <p>While this info.txt file can contain whatever type of info you want, it is written in a v. specific style that looks like this.</p> |
| 132 | | - <pre><code>title: My cool Zine |
| 130 … | + <section id='how-it-works'> |
| 131 … | + <h1>How it Works</h1> |
| 132 … | + <p>The Dat Zine Library is a lot like the comic strip Heathcliff, in that it works on many levels. You can enjoy the library as a patron, as a zinester making a submission, as a librarian tending to a branch, or as a librarian hacker spinning up their own version. I'll try to lightly guide through each scenario!</p> |
| 133 … | + <h1 id="a-word-at-the-start">A Word at the Start</h1> |
| 134 … | + <p> this is a tool of the <em>*~~future~~* </em>, and no matter how you interact with it you'll want to know some future tools and terms, as I'll likely be using them throughout here.</p> |
| 135 … | + <h2 id="future-terms">FUTURE TERMS</h2> |
| 136 … | + <ul id='terms'> |
| 137 … | + <li><strong>The Chorus</strong>: This is the place in which the zine library resides, instead of 'the web'. The Chorus is a space of radical, punk2punk art and software that aims to help build our solarpunk future. It's decentralized, so everything can be done through the community without relying on any central server or authority. Every member of the zine community is an integral part of the digital infrastructure, and your support of a zine in the Chorus directly helps the entire infrastructure.</li> |
| 138 … | + <li><strong>A Zine</strong>: A mix between a love letter and a book. Zines have a loooose definition, cos their power cannot be contained, but generally they are self-published pamphlets that are distributed through a network of friends, cool librarians, and punks. They can be about whatever you want, and look however you want. </li> |
| 139 … | + <li><strong>A Dat Zine</strong>: A mix between a zine and a website. These are self-published dat sites that are distributed through a network of friends, cool dat zine librarians, and solarpunks across the Chorus. They can be whatever you want, coded however you feel comfortable coding, and look however you want. They don't need to be text-based. A cool coded rhythm game could be a dat zine if the spirit is right.</li> |
| 140 … | + <li><strong>Dat</strong>: A protocol for sharing sites, files, and apps in a distributed, decentralized way. It is similar to http, which is the protocol the web uses for sharing web pages. But in the web, pages are held on servers that are then accessed by the site visitors. With Dat, the pages are held on the devices in which they were written, along with the device of every visitor and peer who chooses to seed that site. In this way, there is no central server controlling access, the content lives among the community itself. It is kind of like how torrents work, and kind of like how the web could've worked, but different than both. Because it's a separate protocol from the web, most browsers (like chrome or safari) cannot view a dat zine. There is a new browser, called Beaker Browser, that can view dat sites <em>and</em> create them.</li> |
| 141 … | + <li><strong>swingin' on the flippity flop</strong>: A slang term for 'hanging out'.</li> |
| 142 … | + <li><strong>Beaker Browser:</strong> A web browser for the Chorus. It can be downloaded at <a href="https://beakerbrowser.com">beakerbrowser.com</a>. It can be used to browser the normal web, but can also view dat sites and dat zines. In addition, it has editing and publishing capabilities built in, so you can create your own dat zine from within the browser. </li> |
| 143 … | + <li><strong>Seeding</strong>: A technical method of support. Since the zinester who made the dat zine also acts as the 'server' hosting the zine, the zine may not be accessible if their computer isn't on and Beaker isn't running. You can support their work by clicking the seed option on the beaker browser, which turns your browser into a server for this zine too. Now people can access the zine from either of you. As a zine grows in readership, it also grows in reliance and availability and you can show support to the author in a directly felt and appreciated way, that isn't just monetary.</li> |
| 144 … | + <li><strong>Forking</strong>: An integral, revolutionary part of Dat, Beaker, and the Chorus. Forking means to make a copy of all the files that make up a dat zine, but this copy you have 'write access' to. In other words, make your own copy that you can edit in any way you please. All dat zines can be forked, which means you can be inspired by someone's work, and make a new zine based off their structure. In fact, many of the existing dat zines act as both a zine and an instruction manual for making zines. In the same way, the library can be forked so you have your own branch and you can change up the collection however you please.</li> |
| 145 … | + <li><strong>HTML/CSS/Javascript</strong>: The paper, sharpie, gluestick and scissors for Dat Zines. There is no expertise level required to make a zine. You can do it with the most basic html that you've gathered from old geocities pages. If you want to make a dat zine, but have not coded at all before and feel intimidated, feel free to <a href="mailto:webmaster@coolguy.website">email me</a> and I'd be happy to help where I can!</li> |
| 146 … | + <li><strong>Scuttlebutt</strong>: sea-slang for 'gossip', but also the solarpunk community/protocol of our beautiful future. Scuttlebutt is an incredible way to discover dat zines and talk to other zinesters about it. You can learn more at <a href="https://scuttlebutt.nz">scuttlebutt.nz</a></li> |
| 147 … | + <li><strong>Text Editor</strong>: Literally a program to edit text, but usually refers to one that's meant for writing code of any sort. You will use a text editor to write up your zines. The beta version of beaker has one built in. There are also free text editors available that are mad useful. <a href="https://atom.io/">Atom</a> is a good one, as is <a href="https://www.vim.org/">Vim</a>. (<em>note: Vim has a bit of a learning curve, but it's a beautiful one and can be a life-changing experience. I fuck with Vim.</em>)</li> |
| 148 … | + <li><strong>Command Line or Terminal</strong>: The sacred well hidden beneath the ornate cathedral of your computer. The terminal is available on all Mac and Linux computers, and can be emulated on windows. It's an entirely different way of interacting with and talking to your computer, coming from a more radical and beautiful past. Using the command line can be strange at first, but is incredibly empowering and lets you discover new tools and methods that are hidden away on your device. You likely won't have to use it as just a zine fan, but it's mass recommended when you become a hacker librarian.</li> |
| 149 … | + </ul> |
| 150 … | + <p>Alright, them's the terms lets get to some teachings!</p> |
| 151 … | + <h1 id="visiting-the-library-and-reading-a-zine-">Visiting the Library and Reading a zine!</h1> |
| 152 … | + <p>To get to the library, you will need to download and install beaker browser. You can find instructions for that here: <a href="https://beakerbrowser.com/install/">https://beakerbrowser.com/install/</a></p> |
| 153 … | + <p>Once you have it up and running visit this site:<br><strong>dat://dat-zine-library.hashbase.io</strong></p> |
| 154 … | + <p>Here you'll find all the zines I've written or collected. When you click on the cover for one, you'll be brought to that zine in a new URL. </p> |
| 155 … | + <p>If you click on it, and nothing shows up, that's likely because I forgot to seed the site, and the zinester is not online at the moment and thus the zine is not accessible. Check back again in a bit, and it'd likely be up!</p> |
| 156 … | + <h2 id="good-etiquette">Good Etiquette</h2> |
| 157 … | + <p>If you like a zine, click the three connected dots in beaker's address bar and choose a seeding option:<br><img src="images/seeding-a-dat-zine.gif" alt="gif showing how to seed a dat zine"></p> |
| 158 … | + <p>This supports the creator by helping make it available for everyone else, reducing their hosting burden. Similarly, if you like my zine library, please seed it too!</p> |
| 159 … | + <h1 id="making-your-own-zine-">Making your own Zine!</h1> |
| 160 … | + <p>There's a few ways to go about this. You can either start from an existing dat zine, especially one intended to work as a template, or you can make it entirely from scratch.</p> |
| 161 … | + <p>There's no right way to code a zine, and there's no specific format for it. There is a unifying standard <em>folder</em> though, that marks that specific dat site as a <em>ziiine</em>. It is the <strong>distro</strong> folder.</p> |
| 162 … | + <p>The distro folder has two files:</p> |
| 163 … | + <ul> |
| 164 … | + <li>cover.jpg (or cover.png or cover.gif)</li> |
| 165 … | + <li>info.txt</li> |
| 166 … | + </ul> |
| 167 … | + <p>The image you name as the cover will be used in zine libraries as your cover. The info.txt file contains any information you want people to know about yr zine, and it's displayed at hte bottom of yr zine card in the library. It's a good spot to put the author, the creation date, sharing requests, the music you listened to during the creation of the zine, and so on.</p> |
| 168 … | + <p>While this info.txt file can contain whatever type of info you want, it is written in a v. specific style that looks like this.</p> |
| 169 … | + <pre><code>title: My cool Zine |
| 133 | 170 … | ---- |
| 134 | 171 … | author: Doris Cometbus |
| 135 | 172 … | ---- |
| 136 | 173 … | pertinent things I wanna say: Whatever pertinant thing I wanna say. |
| 137 | 174 … | ---- |
| 138 | 175 … | anything else: |
| 139 | 176 … | yep anythign else! |
| 140 | 177 … | ---- |
| 141 | | - </code></pre><p>In other words, the subect, followed by a colon and whatever it is you wnana write, and then you divide each subject with <code>----</code></p> |
| 142 | | - <p>If you need more guidance on this, I recommend checking out the distro folder of current zines for inspiration.</p> |
| 143 | | - <h2 id="making-a-zine-from-a-template">Making a zine from a template</h2> |
| 144 | | - <p>There's some <em>dat zine styles</em> already out there, which are zines whose structure functions as a template and teaching tool for making your own. Here are two I recommend:</p> |
| 145 | | - <ul> |
| 146 | | - <li><p><strong>Satan, a Real Georgia Peach</strong><p> |
| 147 | | -<p class='template-link'><span>dat://f9c9b6ae86180c119d23b452eefaeb8a494a6c4222e5588f908f5f5ba96f6195/</span></p> |
| 148 | | -<p>This is a comic, that has a cover and back and a long scrolling comic in between. If you click the info button in the top right, you'll see a fork option appear. clicking that will make your own editable copy. Then click the three linear dots in the address bar and choose 'view files'. The readme will guide you from there. In short, you can make it your own without knowing any code, by just changing the comic pages with your own and updating the distro file. Or, you can change the styling and everything else (the readme goes into more details.)</p> |
| 149 | | - </li> |
| 150 | | - <li><p><strong>read me</strong></p> |
| 151 | | -<p class='template-link'><span>dat://d0222b1bcf7833e0708aa65ba8376aadba3f13e3025a113b10f755342b4c14d1/</span></p> |
| 152 | | -<p>This is a short sci-fi story, and an example of a text zine that can have multiple pages. Read to the end page, and you'll see a screen inviting you to copy it. Click that button, name yr zine, and then check out the README for more instructions (you can do this by clicking the three straight dots in the address bar and choosing 'view files'.</p> |
| 153 | | - </li> |
| 154 | | - </ul> |
| 155 | | -<img src='images/view-files-of-zine.gif' alt='illustrating clicking the three dots' /> |
| 156 | | - <h2 id="making-a-zine-from-scratch">Making a zine from scratch</h2> |
| 157 | | - <p>Have at it however you want. You can do this straight from Beaker by clicking the hamburger icon in the top right, then choosing 'create new > website'. This will give you a starting template to go from. The next version of Beaker has a text editor built in and you can create your zine from directly inside the browser. If that's not available for you,t hen you'll want to save these files to your computer and edit them with your text editor of choice (<a href="https://atom.io">atom</a> is a good one). </p> |
| 158 | | - <p>To save it to your computer, in the bottom of the file view in dat you'll see a button for 'set local directory'. Click that, choose where you wanna save it and then open it from there.</p> |
| 159 | | -<img src='images/set-local-directory.gif' alt='clicking local directory button' /> |
| 160 | | - <p>At this point, you already have a dat site. It's the long cipher string in the top right of your library view. As you make changes in your local files, your site gets updated automatically. When you're ready to share it, make a distro folder and then please send the url to me! I want to see it!!</p> |
| 161 | | - <h1 id="becoming-a-zine-librarian">Becoming a Zine Librarian</h1> |
| 162 | | - <p>On my library, beneath my description, you'll see a button to make your own branch. Just click this, and it'll bring up the Forking option. Name your new branch whatever you'd like, and when you press OK you'll be brought to your own library.</p> |
| 163 | | - <p>The view should now change for you, where you'll see edit buttons everywhere. You can now edit the branch details, add new zines, and edit the collections for existing zines. You can also view the files in the backend. The primary one to check out is the zines folder. This contains all the zines you've added in nice text files. In beaker, you can right-click each one to delete it if you want, or select multiple and delete them all if you want a totally fresh branch.</p> |
| 164 | | - <p>Then, check out the folder <code>building/aesthetics</code>. This contains the CSS stylesheets for the library, and is the simplest way to customize things to make them look like yr own. Change the library colors and fonts around, or change the css entirely.</p> |
| 165 | | - <p>The big thing here is to send me that new branch when you ready! I want librarian friends and a full on library web ring, and I'm excited for the zines you make and find.</p> |
| 166 | | - <h1 id="becoming-a-librarian-hacker">Becoming a Librarian Hacker</h1> |
| 167 | | - <p>When you've forked your own version, you can edit any of the code you want. A large amount of this is explained in the readme. Here's some basic tips.</p> |
| 168 | | - <p>To change the overall css, check out building/aesthetics. To edit how the library functions, though, you'll need to to do some javascript.</p> |
| 169 | | - <p>The library is written using node and choo. So you'll want to make sure you have node installed on your computer, and then after you've made changes to run the command <code>npm run build</code>.</p> |
| 170 | | - <p>I'm kinda running outta steam on writing this right now. BUT! If you want to hack on the code itself, but don't know what node means or where you'd run the command <code>npm run build</code>, then please email me and I can help out further! (it also will let me know that someone read this far and needed the info I hadn't yet provided. Until then I'ma sleep!)</p> |
| 171 | | - </section> |
| 178 … | + </code></pre><p>In other words, the subect, followed by a colon and whatever it is you wnana write, and then you divide each subject with <code>----</code></p> |
| 179 … | + <p>If you need more guidance on this, I recommend checking out the distro folder of current zines for inspiration.</p> |
| 180 … | + <h2 id="making-a-zine-from-a-template">Making a zine from a template</h2> |
| 181 … | + <p>There's some <em>dat zine styles</em> already out there, which are zines whose structure functions as a template and teaching tool for making your own. Here are two I recommend:</p> |
| 182 … | + <ul> |
| 183 … | + <li><p><strong>Satan, a Real Georgia Peach</strong><p> |
| 184 … | + <p class='template-link'><span>dat://f9c9b6ae86180c119d23b452eefaeb8a494a6c4222e5588f908f5f5ba96f6195/</span></p> |
| 185 … | + <p>This is a comic, that has a cover and back and a long scrolling comic in between. If you click the info button in the top right, you'll see a fork option appear. clicking that will make your own editable copy. Then click the three linear dots in the address bar and choose 'view files'. The readme will guide you from there. In short, you can make it your own without knowing any code, by just changing the comic pages with your own and updating the distro file. Or, you can change the styling and everything else (the readme goes into more details.)</p> |
| 186 … | + </li> |
| 187 … | + <li><p><strong>read me</strong></p> |
| 188 … | + <p class='template-link'><span>dat://d0222b1bcf7833e0708aa65ba8376aadba3f13e3025a113b10f755342b4c14d1/</span></p> |
| 189 … | + <p>This is a short sci-fi story, and an example of a text zine that can have multiple pages. Read to the end page, and you'll see a screen inviting you to copy it. Click that button, name yr zine, and then check out the README for more instructions (you can do this by clicking the three straight dots in the address bar and choosing 'view files'.</p> |
| 190 … | + </li> |
| 191 … | + </ul> |
| 192 … | + <img src='images/view-files-of-zine.gif' alt='illustrating clicking the three dots' /> |
| 193 … | + <h2 id="making-a-zine-from-scratch">Making a zine from scratch</h2> |
| 194 … | + <p>Have at it however you want. You can do this straight from Beaker by clicking the hamburger icon in the top right, then choosing 'create new > website'. This will give you a starting template to go from. The next version of Beaker has a text editor built in and you can create your zine from directly inside the browser. If that's not available for you,t hen you'll want to save these files to your computer and edit them with your text editor of choice (<a href="https://atom.io">atom</a> is a good one). </p> |
| 195 … | + <p>To save it to your computer, in the bottom of the file view in dat you'll see a button for 'set local directory'. Click that, choose where you wanna save it and then open it from there.</p> |
| 196 … | + <img src='images/set-local-directory.gif' alt='clicking local directory button' /> |
| 197 … | + <p>At this point, you already have a dat site. It's the long cipher string in the top right of your library view. As you make changes in your local files, your site gets updated automatically. When you're ready to share it, make a distro folder and then please send the url to me! I want to see it!!</p> |
| 198 … | + <h1 id="becoming-a-zine-librarian">Becoming a Zine Librarian</h1> |
| 199 … | + <p>On my library, beneath my description, you'll see a button to make your own branch. Just click this, and it'll bring up the Forking option. Name your new branch whatever you'd like, and when you press OK you'll be brought to your own library.</p> |
| 200 … | + <p>The view should now change for you, where you'll see edit buttons everywhere. You can now edit the branch details, add new zines, and edit the collections for existing zines. You can also view the files in the backend. The primary one to check out is the zines folder. This contains all the zines you've added in nice text files. In beaker, you can right-click each one to delete it if you want, or select multiple and delete them all if you want a totally fresh branch.</p> |
| 201 … | + <p>Then, check out the folder <code>building/aesthetics</code>. This contains the CSS stylesheets for the library, and is the simplest way to customize things to make them look like yr own. Change the library colors and fonts around, or change the css entirely.</p> |
| 202 … | + <p>The big thing here is to send me that new branch when you ready! I want librarian friends and a full on library web ring, and I'm excited for the zines you make and find.</p> |
| 203 … | + <h1 id="becoming-a-librarian-hacker">Becoming a Librarian Hacker</h1> |
| 204 … | + <p>When you've forked your own version, you can edit any of the code you want. A large amount of this is explained in the readme. Here's some basic tips.</p> |
| 205 … | + <p>To change the overall css, check out building/aesthetics. To edit how the library functions, though, you'll need to to do some javascript.</p> |
| 206 … | + <p>The library is written using node and choo. So you'll want to make sure you have node installed on your computer, and then after you've made changes to run the command <code>npm run build</code>.</p> |
| 207 … | + <p>I'm kinda running outta steam on writing this right now. BUT! If you want to hack on the code itself, but don't know what node means or where you'd run the command <code>npm run build</code>, then please email me and I can help out further! (it also will let me know that someone read this far and needed the info I hadn't yet provided. Until then I'ma sleep!)</p> |
| 208 … | + </section> |
| 172 | 209 … | |
| 173 | | - <section id='changelog'> |
| 174 | | - <h1>Changelog</h1> |
| 175 | | - <p>A list of cool updates to the library, why they were made, and how they work!</p> |
| 176 | | - <ul id='changes'> |
| 177 | | - |
| 178 | | - <li class='change'> |
| 179 | | - <p class='change-date'>2018-07-14</p> |
| 180 | | - <h2>Libraries now have Collections!</h2> |
| 181 | | - <p>Librarians are going to wanna organize their zines. I wanna organize my zines. As the |
| 182 | | - libraries grow larger, it'll be useful to filter it down by the exact type of zine you're in |
| 183 | | - the mood for. So I added collections as an option to each zine.</p> |
| 184 | | - <p>They are, hopefully, straightforward. When adding a zine you can list collections they're |
| 185 | | - a part of. Then, these collections get shown in the top view and you can browse the zines by |
| 186 | | - them!</p> |
| 187 | | - <p>I worked with some basic convictions for this feature, which were:</p> |
| 188 | | - <ul> |
| 189 | | - <li>Collections Are Specific to Libraries, they do not transfer between libraries.</li> |
| 190 | | - <li>A zine can be a part of multiple collections.</li> |
| 191 | | - <li>Collections are Optional</li> |
| 192 | | - <li>Collections are human readable, and human writable, with minimum contortion.</li> |
| 193 | | - <li>Collections offer another way to traverse a library</li> |
| 194 | | - </ul> |
| 195 | | - <p>Keeping these friends in mine, i tried to make it as simple as possible! I am proud of a |
| 196 | | - lot of the stuff here, but I think the site feels kinda janky overall and needs to be |
| 197 | | - <em>refactored</em>. Maybe that's next!</p> |
| 198 | | - </li> |
| 199 | | - </ul> |
| 200 | | - </section> |
| 201 | | - </div> |
| 202 | | - </article> |
| 203 | | - <script> |
| 204 | | - // Code learned from this article: https://medium.com/@pimterry/better-css-only-tabs-with-target-7886c88deb75 |
| 205 | | - // the javascript is to make it so the links don't jump you around the page. |
| 206 | | - var hashLinks = document.querySelectorAll("a[href^='#']"); |
| 210 … | + <section id='changelog'> |
| 211 … | + <h1>Changelog</h1> |
| 212 … | + <p>A list of cool updates to the library, why they were made, and how they work!</p> |
| 213 … | + <ul id='changes'> |
| 214 … | + |
| 215 … | + <li class='change'> |
| 216 … | + <p class='change-date'>2018-07-14</p> |
| 217 … | + <h2>Libraries now have Collections!</h2> |
| 218 … | + <p>Librarians are going to wanna organize their zines. I wanna organize my zines. As the |
| 219 … | + libraries grow larger, it'll be useful to filter it down by the exact type of zine you're in |
| 220 … | + the mood for. So I added collections as an option to each zine.</p> |
| 221 … | + <p>They are, hopefully, straightforward. When adding a zine you can list collections they're |
| 222 … | + a part of. Then, these collections get shown in the top view and you can browse the zines by |
| 223 … | + them!</p> |
| 224 … | + <p>I worked with some basic convictions for this feature, which were:</p> |
| 225 … | + <ul> |
| 226 … | + <li>Collections Are Specific to Libraries, they do not transfer between libraries.</li> |
| 227 … | + <li>A zine can be a part of multiple collections.</li> |
| 228 … | + <li>Collections are Optional</li> |
| 229 … | + <li>Collections are human readable, and human writable, with minimum contortion.</li> |
| 230 … | + <li>Collections offer another way to traverse a library</li> |
| 231 … | + </ul> |
| 232 … | + <p>Keeping these friends in mine, i tried to make it as simple as possible! I am proud of a |
| 233 … | + lot of the stuff here, but I think the site feels kinda janky overall and needs to be |
| 234 … | + <em>refactored</em>. Maybe that's next!</p> |
| 235 … | + </li> |
| 236 … | + </ul> |
| 237 … | + </section> |
| 238 … | + </div> |
| 239 … | + </article> |
| 240 … | + <script> |
| 241 … | + // Code learned from this article: https://medium.com/@pimterry/better-css-only-tabs-with-target-7886c88deb75 |
| 242 … | + // the javascript is to make it so the links don't jump you around the page. |
| 243 … | + var hashLinks = document.querySelectorAll("a[href^='#']"); |
| 207 | 244 … | var summary = document.querySelector('#summary') |
| 208 | 245 … | //that above regular expression says "select all a tags where their href links starts with # |
| 209 | 246 … | hashLinks.forEach( function (link) { |
| 210 | | - link.addEventListener('click', function (e) { |
| 211 | | - if (link.text !== 'Dat Zine Library') { |
| 212 | | - e.preventDefault() |
| 213 | | - history.pushState({}, '', link.href) |
| 214 | | - history.pushState({}, '', link.href) |
| 215 | | - history.back() |
| 216 | | - summary.classList.add('hidden') |
| 217 | | - } else{ // If you click the project title, show the summary again. |
| 218 | | - summary.classList.remove('hidden') |
| 219 | | - } |
| 220 | | - //what this does is makes the site forget everything it usually does when an <a> is clicked |
| 221 | | - // (the preven default), then manually pushes the state of the browser history to be as if |
| 222 | | - // we've clicked the link. |
| 223 | | - }) |
| 247 … | + link.addEventListener('click', function (e) { |
| 248 … | + if (link.text !== 'Dat Zine Library') { |
| 249 … | + e.preventDefault() |
| 250 … | + history.pushState({}, '', link.href) |
| 251 … | + history.pushState({}, '', link.href) |
| 252 … | + history.back() |
| 253 … | + summary.classList.add('hidden') |
| 254 … | + } else{ // If you click the project title, show the summary again. |
| 255 … | + summary.classList.remove('hidden') |
| 256 … | + } |
| 257 … | + //what this does is makes the site forget everything it usually does when an <a> is clicked |
| 258 … | + // (the preven default), then manually pushes the state of the browser history to be as if |
| 259 … | + // we've clicked the link. |
| 260 … | + }) |
| 224 | 261 … | }) |
| 225 | | - </script> |
| 226 | | - </body> |
| 262 … | + </script> |
| 263 … | + </body> |
| 227 | 264 … | </html> |
| 228 | 265 … | |
| 229 | 266 … | |
| 230 | 267 … | |