Learn 11ty, Nginx and Twit

Eleventy, or 11ty,  is a simple yet very powerful static site generator. It does not require any config to get started.

This what it will take you to get an 11ty project running.

```
npm install -g @11ty/eleventy
echo '# Page header' > README.md
eleventy
```

After watching this collection you will be able to:

* Bootstrap a simple 11ty website
* Use 11ty layouts
* Chaining multiple 11ty layouts
* Use 11ty Collections
* Create pages from data

...and much more

Eleventy was created to be a JavaScript alternative to Jekyll. It’s zero-config by default but has flexible configuration options. Eleventy works with your project’s existing directory structure.

Eleventy uses independent template engines. We don’t want to hold your content hostage. If you decide to use something else later, having your content decoupled in this way will make migration easier.

11ty

Getting Started with Eleventy

In this course we’ll learn how to create Twitter bots. We’ll first learn how to interface with the Twitter API using Twit.js, which allows us to post statuses, search tweets, and interact with followers. We’ll create several example bots that show the diversity of possibilities, using powerful tools such as RiTa.js, Google’s Cloud Vision API, and Tracery. We’ll learn how to tweet data from Google Spreadsheets, and to compose and tweet a song for an audio bot. We’ll also learn how to host our bot logic on Heroku and Docker. 

Twitter API Client for node

Supports both the REST and Streaming API.

twit

Create your own twitter bots

Learn how to make flexible customized Twitch Scenes using the static site generator Eleventy (11ty), CSS, and ComfyJS.

Throughout this course, you'll create scenes for preshow, host, and main desktop display streaming purposes. Using ComfyJS, we'll add embedded chat and be able to create responses to chat commands. Finally, we'll see how to actually setup the scenes in OBS to prepare to use them for your stream.

Bonus: you'll learn a bit more about CSS grid layout, and also the "cicada principle" to be able to show the commands randomly across the scene!

Develop Custom Twitch Scenes and Setup in OBS

Start from a blank project and build up to an Eleventy site that includes a blog collection and is prepared to source content from a headless CMS. You'll also learn how to add Sass as the styling solution, complete with triggering 11ty to re-compile when the Sass changes.

These lessons will help explain key 11ty features and concepts to help you make the most of this amazing static site generator.

By the last lesson, you'll have learned how to:
- define custom `input` and `output` directories
- create a layout that accesses front matter variables
- watch for Sass changes and include CSS in the build proces
- create an 11ty collection using `tags`
- define front matter for an entire collection
- make and apply a filter to a collection
- generate pages from an external data source, such as a CMS or API

Build An Eleventy (11ty) Site From Scratch

We’ll get a real-time stream of tweets, and learn how to filter a stream by keyword, location, and user.

Use the Twitter Stream API with Twit.js

NGINX is a free, open-source, high-performance HTTP server and reverse proxy, as well as an IMAP/POP3 proxy server. 

nginx

Learn about the concepts of managing data within Docker volumes, including all of the commands to create and manage volumes. We'll demonstrate how to mount a Docker volume to one or many containers by creating and mounting a volume to an Nginx proxy, and then verify the output with curl. You'll also see how changes to files within volumes of one container propagate to other containers with the same volume mounted, and learn various commands to inspect Docker volumes.

Manage Data within Docker Volumes

In this lesson, our bot will tweet hello to the Twitter world! We'll do this by using Twit's POST method to post our status to the statuses/update endpoint.

Post Statuses with Twit.js

In this lesson, we’ll create multiple functions to request, download, and save photos and data from NASA's API, and then have our bot upload these photos to Twitter and post them along with their descriptions. We'll also learn how to tweet videos using a video from NASA’s space archives.

Tweet Media Files with Twit.js

We’ll learn how your bot can get its list of followers, follow people, and look up friendships. We'll use Twit's GET method to get our followers at the followers/list endpoint, to get the users we follow at the friends/ids and friends/list endpoints, and to look up our friendships with the friendships/lookup endpoint. We'll also use Twit's POST method to follow someone at the friendships/create endpoint, and to send messages by posting to the direct_messages/new endpoint. 

Work with Users in Twit.js

We’ll learn the basics of interacting with tweets, including retweeting, deleting, favoriting, and replying to tweets. We'll get our home timeline by using Twit's GET method to access the `statuses/home_timeline` endpoint, including the count parameter, which lets us get back a certain number of tweets. We'll also pass it a callback. We'll learn how to cycle through the data (the tweets) we get back and see what information is included. We'll learn how to retweet statuses by posting to `statuses/retweet` and including the tweet id. We can unretweet by posting to `statuses/unretweet` with the same tweet id. We'll also learn how to like a tweet by posting to `favorites/create` with a tweet id, and unlike a tweet by posting to `favorites/destroy` with a tweet id. We'll also learn how to reply to a tweet by posting to `statuses/update`, with a status that includes the handle of the user we're replying to and `in_reply_to_status_id` parameter, which is the id of the tweet we're replying to. We'll learn how to delete a tweet by posting to `statuses/destroy` with the tweet's id. 

Interact with Tweets with Twit.js 

We’ll learn how to search tweets with the Twitter Search API, using Twit's GET method to get the search/tweets endpoint. We'll use the query and count parameters to get the search term(s) and number of tweets that we want. We'll learn how to get exact phrases, multiple words, one of several words, emoticons, hashtags, photos/videos, urls, and how to remove words from our results. We'll learn how to implement the safe filter and how to filter by media, website, or date. We'll learn how to get recent results, popular results, results by location, and results by language. 

The search API returns for relevance, and not completeness. If you want all the tweets from a search term, you should use the stream API (which we'll go over in the next lesson). 

Use the Twitter Search API with Twit.js

We’ll go over the basic Twitter bot setup, including how to start a project from scratch, install necessary packages, and store our private keys in environment variables. 

Set Up a Basic Twitter Bot with Twit.js

Learn how to setup an Nginx proxy server with Docker that sits in front of a Node.js app. You can use a proxy to control the flow of frontend requests hitting your app, as well as to achieve better performance and scalability. We'll create a sample Node.js app, configure a default Nginx configuration file for proxying web requests, build both Node.js and Nginx Docker images, and learn how to link everything up and get it running with Docker specifics.

Setup an Nginx Proxy for a Node.js App with Docker

Node.js apps built with Docker cannot scale horizontally by themselves. In this lesson we will spawn out multiple Node.js processes/containers, and move the incoming request handler to an Nginx proxy to load balance and properly scale our Node.js app.

Scale Docker Horizontally with Nginx Load Balancing

In this video, you will learn to bootstrap an eleventy project.

we'll start from an empty directory, initialize it as an npm package, install `@11ty/eleventy` package and create the website entry point.

Eleventy can compile multiple file formats, HTML, markdown, liquid, and njk.

Check out the eleventy [docs](https://www.11ty.dev/docs/) for more information.

Bootstrap an eleventy project

In this video, you will learn how to use the eleventy layouts feature.
Eleventy Layouts are special templates that can be used to wrap other content.


for more information check the layouts [docs](https://www.11ty.dev/docs/layouts/)

Use eleventy layouts

In this video, you will learn how to use layout chaining with eleventy.
Layouts in eleventy can use other layouts. You can also use a different template engine across layouts. This is very handy if we want to wrap some pages with extra markup but not all the pages.


for more information check out the eleventy [docs](https://www.11ty.dev/docs/layout-chaining/)

Use Layout Chaining in eleventy

In this video, you will learn how to use the collection feature in eleventy.
Collections will allow to group content under one tag and loop through it in your template files

for more information check out the eleventy [docs](https://www.11ty.dev/docs/collections/)

Use Collections in eleventy

In this video, you will learn how to create pages from data in eleventy. a data source can be a JSON file or a js file.

for more information check out the eleventy [docs](https://www.11ty.dev/docs/pages-from-data/)

Create pages from data in eleventy

Begining from a brand new project, learn how to install Eleventy (11ty), and add `develop` and `build` scripts. Next, define a custom configuration to set preferred input and output directories. Then create a home page file and your first layout while learning how 11ty handles mixing templating languages.

Create an Eleventy (11ty) Site From Scratch

Learn how to add Sass to an Eleventy (11ty) project including directing 11ty to re-compile when Sass changes are made. This step involves adding two new functions to the `.eleventy.js` configuration: `addWatchTarget()` and `addPassthroughCopy()`. Then, define the link to the compiled CSS file within an 11ty layout.