Front End Curriculum

This is a small static Jekyll site that contains the front end program's lessons and projects.

License

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

Getting Started

Development Branch

A develpment server is running for the development branch of this project. You can find that site here.

Prerequisites

In order to get this repo up and running you will need to have Ruby 2.7.4 installed and active.

Install Homebrew if you don't already have it:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Follow prompts if necessary (you may need to enter your computer password, as well as run a few scripts prompted in the terminal output).

Install Ruby Version Manager:

\curl -sSL https://get.rvm.io | bash -s stable

Install Ruby version 2.7.4 using RVM:

rvm install 2.7.4

You will also need the bundler and jekyll gems installed.

gem install bundler
gem install jekyll

Installing

Once you have Ruby, Bundler, and Jekyll installed, you can install dependencies by running:

bundle

And after all dependencies are installed, you can run the following to start your local server on port 4000:

bundle exec jekyll serve

Styling Your Lesson Plans

You can add styled boxes to your lesson plans for different areas of content.

Standard Box:

<section class="call-to-action">
### In Your Notebook

What would you expect to be logged when we get to line 10? Why?
</section>

Will result in the following styled box:

Answer/Solution Box:

The heading in the answer box must be an h3. You can include any text within the section after that

<section class="answer">
### The Answer  

Here is an answer to the On Your Own section...
</section>

Will result in the following styled box:

Note Box:

<section class="note">
### Note

This hoisting behavior adds some complexity to the JavaScript language, and is important to understand thoroughly in order to anticipate the values of your variables at any given time.
</section>

CFU/Exit Ticket Box:

<section class="checks-for-understanding">
### Exit Ticket

What are 3 easy and actionable accessibility steps you can take in all of your projects from here on out?
</section>

DO NOT INDENT YOUR MARKDOWN within the section tag, or else it will not work.

Algolia Search

The site uses Algolia for search indexing. To re-index the search when new lessons are added or lessons are removed, run this command in your terminal at the root of the curriculum directory:

ALGOLIA_API_KEY=admin_api_key bundle exec jekyll algolia push

Where admin_api_key is replaced with the actual admin API key found in the Algolia account dashboard.