An open API service indexing awesome lists of open source software.

https://github.com/becodeorg/free2code

Content to Learn frontend coding for the Erasmus+ Free To Code Project
https://github.com/becodeorg/free2code

Last synced: over 1 year ago
JSON representation

Content to Learn frontend coding for the Erasmus+ Free To Code Project

Awesome Lists containing this project

README

          

# Free 2 Code - Curriculum

## Index

1. ### Prerequisite quizz (Printed Paper)

1. ### [General Intro to the course](./0.GENERAL/General-Introduction.md)

1. ### General

1. [History of the Internet and The First Browser](./0.GENERAL/Background.md)

1. ### HTML
1. [HTML - html5](./1.HTML/2.HTML5.md)
1. [HTML - html5 exercises](./1.HTML/exercises/Intro)
1. [HTML - Semantics](./1.HTML/3.Semantics.md)
1. [HTML - Semantics exercises](./1.HTML/exercises/Semantics)

1. ### CSS

#### Introduction
1. [CSS - Introduction to CSS](./2.CSS/0.INTRODUCTION-TO-CSS/readme.md)
1. [CSS - Introduction to CSS exercises](./2.CSS/0.INTRODUCTION-TO-CSS/exercises.md)
----
#### Selectors
1. [CSS - Selectors Exercise series](./2.CSS/1.SELECTORS/exercises.md)
1. [CSS - Selectors Exercise 3](./2.CSS/1.SELECTORS/exercise-3/exercise.md)
1. [CSS - Selectors Exercise 4](./2.CSS/1.SELECTORS/exercise-4)
----
#### Basic properties
1. [CSS - Basic properties exercise](./2.CSS/2.BASIC-PROPERTIES/readme.md)
----
#### Positioning
1. [CSS - Positioning](./2.CSS/3.POSITIONING/readme.md)
----
#### Display
1. [CSS - Display exercise 1](./2.CSS/3.POSITIONING/1.display/exercise-01.md)
1. [CSS - Display exercise 2](./2.CSS/3.POSITIONING/1.display/exercise-02.md)
----
#### Position
1. [CSS - Position exercise 1](./2.CSS/3.POSITIONING/2.position/exercise-1.md)
1. [CSS - Position exercise 2](./2.CSS/3.POSITIONING/2.position/exercise-2.md)
----
#### Flex box
1. [CSS - Flex basics exercise](./2.CSS/3.POSITIONING/3.flex/1.flex-basics/exercise.md)
1. [CSS - Flex box froggy](./2.CSS/3.POSITIONING/3.flex/2.flexboxfroggy)
1. [CSS - Flex card](./2.CSS/3.POSITIONING/3.flex/3.flex-card/exercise.md)
----
#### Components
1. [CSS - Components exercise 1](./2.CSS/3.POSITIONING/4.components/exercise-1.md)
1. [CSS - Components exercise 2](./2.CSS/3.POSITIONING/4.components/exercise-2.md)
1. [CSS - Components exercise 3](./2.CSS/3.POSITIONING/4.components/exercise-3.md)
1. [CSS - Components exercise 4](./2.CSS/3.POSITIONING/4.components/exercise-4.md)
1. [CSS - Components exercise 5](./2.CSS/3.POSITIONING/4.components/exercise-5.md)
1. [CSS - Components exercise 6](./2.CSS/3.POSITIONING/4.components/exercise-6.md)
1. [CSS - Components exercise 7](./2.CSS/3.POSITIONING/4.components/exercise-7.md)
----
#### CSS Animation
1. [CSS - CSS animation](./2.CSS/4.CSS-ANIMATIONS/readme.md)
1. [CSS - CSS animation exercise 1](./2.CSS/4.CSS-ANIMATIONS/exercise-01/exercise.md)
1. [CSS - CSS animation exercise 2](./2.CSS/4.CSS-ANIMATIONS/exercise-02/exercise.md)
1. [CSS - CSS animation exercise 3](./2.CSS/4.CSS-ANIMATIONS/exercise-03/exercise.md)
1. [CSS - CSS animation exercise 4](./2.CSS/4.CSS-ANIMATIONS/exercise-04/exercise.md)
1. [CSS - CSS animation exercise 5](./2.CSS/4.CSS-ANIMATIONS/exercise-05/exercise.md)
1. [CSS - CSS animation exercise 6](./2.CSS/4.CSS-ANIMATIONS/exercise-06/exercise.md)
1. [CSS - CSS animation exercise 7](./2.CSS/4.CSS-ANIMATIONS/exercise-07/exercise.md)
1. [CSS - CSS animation exercise 8](./2.CSS/4.CSS-ANIMATIONS/exercise-08/exercise.md)
1. [CSS - CSS animation exercise 9](./2.CSS/4.CSS-ANIMATIONS/exercise-09/exercise.md)
----
#### Final Challenge
1. [CSS - Final Challenge](./2.CSS/5.FINAL-CHALLENGE/readme.md)

1. Logical Thinking games (Blockly)
1. https://blockly.games ([offline](https://github.com/google/blockly-games/wiki/Offline) version)

## Reference list (as they appear in the text)

1. Portrait of Tim Berners-Lee - © Paul Clarke, CC BY-SA 4.0, via Wikimedia Commons. Source: https://en.wikipedia.org/wiki/Tim_Berners-Lee
1. Screen capture of the first browser developed by Sir Tim Berners-Lee - Image author: Tim Berners-Lee (public domain) - Source: https://en.wikipedia.org/wiki/WorldWideWeb
1. How does the Internet work? by Mozilla Contributors licensed under CC-BY-SA 2.5. Source: https://developer.mozilla.org/en-US/docs/Learn/Common_questions/How_does_the_Internet_work
1. HTML Basics by Mozilla Contributors and is licensed under CC-BY-SA 2.5. Source: https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics
1. Using HTML sections and outlines by Mozilla Contributors, licensed under CC-BY-SA 2.5. Source: https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines%23section_elements_in_html5
1. [Using HTML sections and outlines](https://learnabouthtml5.blogspot.com/2016/12/using-html-sections-and-outlines.html)
1. Rome celebrates short but beautiful file of Rafael. Source: https://www.nytimes.com/2020/03/06/arts/raphael-rome-coronavirus.html
1. Full list of colors available on W3Schools: https://www.w3schools.com/colors/colors_names.asp
1. The Duffer Brothers. Source: https://www.strangerthings.fr
1. Comments on CSS, adapted from: https://www.w3schools.com/css/css_syntax.asp
1. Oliver James on Pseudo-classes. Source: https://www.internetingishard.com/html-and-css/css-selectors/#pseudo-classes-for-links
1. Animation Value Graph - Timing - Leanndro www.leanndro.com - Source: http://spungella.blogspot.com/2016/03/animation-value-graph-timing.html
1. Monster Inc Typing GIF. Source: https://tenor.com/view/monsters-inc-typing-group-chat-is-lit-gif-11492598