User:Bnstlv/paged-js

back to home

Paged.js

On Oct 13th, 2022 I was part of the Paged.js Workshop - a one-day web-to-print session during which we dived into the capabilities of this platform.

Links:

1. https://coko.foundation
   1. https://mattermost.coko.foundation/login - chat/community on Mattermost (needs registration)
   2. https://discourse.cabbagetreelabs.org
2. http://www.lesvoisinsdustudio.ch/hybrid/hybrid.html
3. Video recording: https://media.xpub.nl/2022/2022-10-13-pagedjs.html

- Consider donating if you want to support their work!

---

>> Pad with notes

Short intro vocabulary:

• HTML = tool to write semantic content
• CSS = cascading style sheet
• Responsive = Erica “a lot of pain” :)) flexibility, adaptiveness
• Printed book = what is a book? what is a printed book?
  • book = traditional definition, content, fixed layouts

- About Johannes Gutenberg
- The Gutenberg Project

• Website
• Single source publishing = when we speak about printing from the web we don't think of the physical object itself (a book) but rather than the content that goes into a variety of many different formats;
• Flux = Pagination
• Missing features = running headers, page number, facing pages, page float, etc.

- Paged.js is there for the missing features
   based on W3C / specifications  (respect for standards)
   polyfill = tool that translates content code that implements features on web browsers that do not support the features (transforming content into the browser can understand!

How paged.js work? And the steps we need to take:

1. create a
2. create “page”
3. define the page areas to put our content
4. features

   ##page sizes and margin (mm, but also px is fine)
   ##point is more precise than px for typography
   ##symmetric margins
   ##page breaks / but also we can avoid page breaks
   ##page numbers 
   ##string-set (running headers and footers) - when titles are running out of the page and we want to place them onto the next
   ##pseudo class selectors for pages 
   ##blank page
   ##naming pages (in case we have different types of pages and we want to give them a different layout as well, for example, we have 4 pages and for each one of them we can assign a different layout via this function)
   ##columns layout
   ##cross references = ex: see in this # page (referencing through CSS so we can refer the reader easily to a specific section of our work, text, book, etc)

---

Mission and Vision - their WHY

- Open-source
- "Political point of view: free access"Important for Coko* to do whatever you want with Paged.js to do anything, including making money
- "Pragmatic point of view: collaboration"

• Paged.js is maintained by the nice folks at Coko.

- тези двете неща го правят сигурно, защото е независимо, предлага голяма степен на колаборативност.

Examples of people who used their platform to make publications: https://pagedjs.org/made-with-paged.js.html - https://controverses.org/mode-demploi/ (++++ book) - https://waldenpond.press/ - generative pdf platform, customised to your liking and what you wanted to read throughout the month (it's on a monthly basis)

HTML is amazing because it is a language that talks to all browsers. Yet, writing HTML is not easy, you need to create many things. what can help you write HTML easier, simple text files, etc. In the end, you have a complex language that could not be understood by the browser, so the print editor marks down the content (it limits you) and you can have a conversation with the browser and tell it how your file should look and be printed. - not sure if I understood it correctly tho.

---

HANDS ON TIME!
For the workshop, you need:

* a code editor
* a local server
* one of the starter kits
   **plugins
   **print a webpage
* suggestion for content from Gutenberg library

GitHub - https://github.com/w3c/css-print - https://github.com/w3c/css-print/issues/3 - https://gitlab.coko.foundation/pagedjs/pagedjs/ - main page on Gitlab

http://www.lesvoisinsdustudio.ch/hybrid/hybrid.html

WHAT I DID: https://hub.xpub.nl/breadcube/~bo/paged.js/themountaineer.html - chose a book from Gutenberg about Mountaineering (miss hiking and the mountains) - exported the HTML - opened the Paged.js and Jupyter Lap - started to edit the html and css but it was too hard for men, did not know where to start - Julie came to me and helped me beautify mu html code; it was too messy and hard to understand parent from child:

   - https://github.com/brackets-beautify/brackets-beautify 
   - https://stackoverflow.com/questions/34478731/brackets-io-is-there-a-way-to-auto-indent-format-html 

- cleared up almost the whole content and left only two chapters (nothing personal to the authors) it was hard to digest and so i scaled it down to 20 pages - redid the cover image and title, changed the background color - tried to fix the images to better fit into the pages but i lost the fight - at the end i finally started to get what i was doing soo - presented our books and shared how this whole experience felt a bit like hiking, difficult, tiring but I managed to get to the base camp which was the most important - J&J are super cool people, helpful and encouraging, great sense of humour - great solution, good cause, consider donating some money so they can keep going

Really liked everyone’s books, especially Stephen, Suzan, Chae (pdf that captures moments by using gifs), and the girl next to her (XPUB3), Miriam (meme)