Miguel Piedrafita

AMP Book

Building a new book reading experience with AMP Stories.

Table of Contents

  • Chapter 1
  • Chapter 2
  • Chapter 4
  • Wait, where did Chapter 3 go?
  • Chapter 3
  • Oh, there it is!
  • Roko's Basilisk
  • Chapter 3.141592
  • Honestly why are you bothering to read this
  • About the author

Welcome to the Demo

Let me tell you a story. I've rewritten the text here around three times now. First one was the actual contents of the book I made this for, which btw is really good and you should totally read. Second was when making some placeholder text to show how the format worked to Twitter (did I mention I tweeted the whole process of building this?). Anyway, I was polishing everything up to open-source it, and decided that writing this again was the best possible use of my time. I miss school.

Please make a wiser use of your time


I'm supposed to showcase the functionality of this thing here, but I'm not clever enough to come up with a clever excuse to do it. What can you do, you say? It's HTML, so basically anything. Wanna bold some text? Throw a <b> tag and you're set. Italics? <i> is your friend. Wouldn't this be much better if you used markdown instead? I literally hacked this together in like three hours, and I'm using echo to render it to the browser, you really thing Markdown is the first thing I'd refactor? You're probably right actually, but don't tell anyone.

This is a title. Its boooooold and black, but not as bold as chapter titles.

I'm honestly pretty sure no one's gonna bother to read this far, and if you're doing it then you probably should be doing something else instead. Maybe, instead of reading my pathetic excuse for some copy, you could brighten someone's day by telling them how much they mean to you. But no, you're still here. Good job. I feel like I could fill this with a bunch of Lorem Ipslum and you'd read it anyways.

Go away

Oh, and by the way, if you're reading this from your desktop you should probably... not do that. I was in a hurry, so instead of doing some sensible responsible layout I hacked together something that hold itself together with some hardcoded margins. Maybe if you turned however that thing to simulate you're browsing from a phone on DevTools is called it would look better. Maybe not. I'm lost without Tailwind, okay?

Okay bye

About the Author

I hand-crafted this cool about the author page to show the avatar and title on all pages. Well, technically I hand-crafted all templates, but this one is written directly on the HTML instead of on the book data. No reason for this other than lazyness, honestly.

About the Author

You can have as many of these as you want. You could also extract this to be generated from data like I should have done, but hey, what works works. No one's gonna know how each part is generated by looking at the final product anyways. Well unless you look up the source on GitHub, but you've probably seen worse in there.

About the Author

Anyways, since you're here you might as well learn something about me. I'm either 18 or forgot to update this when I stopped being 18. I'll probably be 18 for a while, but if everything works as expected at some point I'll stop being 18. Or maybe not, I don't really have any proof for it, only expectations.

About the Author

In fact, if you think about it, age is just something that exists in our minds, like numbers. Did you ever see a three in nature? I didn't think so. Maybe you saw three trees, or a three-shaped tree, but a three? Only in your mind. Maybe in mine too, maybe not. Solipsism is fun. But I digress.

About the Author

Hi! I'm Miguel Piedrafita, a $number-year-old maker. What have I made, you ask? Well, I made this thing you're staring at. No, not your screen, the thing displayed in it. I also made some more apps that are sometimes useful to developers but also incredibly difficult to explain to your parents or your friends. Normies, heh. Anyway, learn more about me and my projects on my website. Or don't. I will never know.