Scrimba-Front-End-Path

Scrimba Front-End Developer Path Assignments and Projects

Course Info

This course teaches Front-End development with separate 14 modules.
Course Site.

I will share my code while taking this course.
I mostly do coding before instructors.

First two modules are introduction and basic HTML and CSS.
I finished HTML and CSS modules deeply in this repo. You can check it there.
Scrimba-Responsive-Design

This is why I start with Module 3.

Module 3 - Making Websites Interactive

This module teach JavaScript basics.

Blackjack Game - Live Demo - Source Code
A basic Blackjack game.
Chrome Extension - Live Demo - Source Code
An extension for HR. Not has fully functionality in browser. Should be in active extensions.
Personality in Emojis - Live Demo - Source Code
An array training. Add remove elements into end or begin.

Module 4 - CSS & JavaScript fundamentals

CSS Challenges Part
This three example taken from my other repo that I completed Responsive Design Course.

Practice Time - Live Demo - Source Code
Compound Practice - Live Demo - Source Code
Putting It All Together - Live Demo - Source Code

JavaScript Challenges Part

Modal - Live Demo - Source Code
Search Bar - Live Demo - Source Code
Carousel - Live Demo - Source Code
Dice Game - Live Demo - Source Code
Snake Game - Live Demo - Source Code

Module 5 - Responsive Design

This module aims to think responsively and adapt responsive design to web projects.
Also part of the this repo.

More Fancy - Live Demo - Source Code
Living the Simple Life - Live Demo - Source Code
A complete responsive blog site.
BBQ Splash Page - Live Demo - Source Code

Module 6 - Next-level JavaScript

This module teaches modern JavaScript patterns. ES6+.

PacMan Game - Source Code
Not completed 🥺

Module 7 - Working with APIs

This module teaches APIs with showing different APIs and introduces Asynchronous JavaScript.

Bored Bot - Live Demo - Source Code
Generate random image and random idea to solve your boringness.
Use random dog image API and random idea API.
BlogSpace - Live Demo - Source Code
Get some random blog posts from an Blog API.
Send request to API with adding new blog post and render it.
War Card Game - Live Demo - Source Code
A basic playing card War Game. Use Playing Card API.
Dashboard Extension - Live Demo - Source Code
A chrome extension that shows current currency, weather and time in every new page opened.
Use weather api, geolocation api and an open source currency api.

Module 8 - Building apps with Flexbox and Grid

This module teaches flexbox and grid. How to adapt those designs to web projects.
Also part of the this repo.

Card Component - Live Demo - Source Code
Marketing Agency (with Flexbox) - Live Demo - Source Code
Instructor creates this page with CSS Grid but I created this page with Flexbox.

Flexbox challenges with APIs.

Color Map - Live Demo - Source Code
Photo Gallery - Live Demo - Source Code
Online Users - Live Demo - Source Code
User Profile - Live Demo - Source Code

Grid challenges with APIs.

Jeopardy (True or False Game) - Live Demo - Source Code
Pokedex - Live Demo - Source Code
Library - Live Demo - Source Code

Module 9 - Learn UI Design

This module teaches UI Design fundamentals and how to apply those with CSS. For better learning and gaining more UI design skills, I completed UI Design Bootcamp that has more modules than the one in front-end path.

UI Design Bootcamp

Simple Layout - Live Demo - Source Code
Responsive Layout - Live Demo - Source Code

Module 11 - React Basics

This module teaches react basics.

muhammedogz/Scrimba-Front-End-Path