alsoamit / flexbox.fun

Playground that lets you experiment and master Flexbox Concepts

Home Page:https://flexbox.fun

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Introduction

Flexbox.fun is an interactive playground that helps you master Flexbox concepts while having fun.

Screenshot from 2023-04-25 18-17-14

Features

  1. Learn difficult concepts by playing around.
  2. Highly Interactive tutorials with widgets (upcoming).
  3. Helps you build your confidence in Flexbox.

Usecases

  1. Create and experiment with different layouts using Flexbox for faster learning.
  2. Perfect your Flexbox skills with easy experimentation and revision.
  3. Ideal for creators looking to demonstrate Flexbox concepts through video tutorials.

Getting Started

  1. Fork-Clone the repo.
  2. Install dependencies.
yarn install
  1. Run the development server:
yarn dev

Open http://localhost:3000 with your browser to see the result.

Vision

  1. Interactive Tutorials: Text based tutorials along with interactive widgets and Videos.
  2. Skins: Skins for the playground and Flexbox items.
  3. Sound Effects
  4. Description of Active property: Show a guide of the latest property clicked by the user below the playground.

About

Playground that lets you experiment and master Flexbox Concepts

https://flexbox.fun

License:MIT License


Languages

Language:TypeScript 91.4%Language:JavaScript 3.6%Language:CSS 2.6%Language:Shell 2.5%