Text And Code: Alice's Adventures in Computerland
Welcome to the course Text and Code.
In this series of classes from the Publication Station we will use code to load and layout large bodies of text on the web. The visitor of your online publication will be given the option to display the text in several ways.
We will also make the publication interactive, allowing the user to find, filter and highlight the text. As a final touch we work on creating animated SVG’s exported from Illustrator.
Program
Class 1
Demos
- HTML/CSS/JavaScript
- WebScraper, CSV and JSON
- CSS grid
Setup
During the first class we work in groups of 3.
We will work in Visual Studio Code. Download and install Visual Studio Code.
To help you out with this project we have created some starter files.
- Go to the files
- Click "Clone"
- Select "Visual Studio Code (SSH)"
- This will open the files in Visual Studio Code
Tasks
1. Use the WebScraper.io extension to scrape Alice in Wonderland or any other book you like.
- Follow instructions on web scraping
- Transform `CSV` to `JSON` with CSV2JSON
2. Add a CSS grid
- Add CSS grid and create a layout
- Play CSS Grid Garden
3. Creating and adding images
- Create images with Dall-E Mini
- Add images via the `JSON` files
Class 2
Demos:
- Loading of fonts
- CSS filters and animations
- Adding content filters with JavaScript
- Adding a search
Class 3
Demos:
- Analyzing text
- Adding an index
Class 4
...
Class 5
...
