Courses Website

This is a learning project using the Course Template 🟣 by Flowbase.co.

This project is created exclusively for learning and the target is to show the workflow of creating a somewhat real page via HTML, CSS & JS. No fancy (and unnecessary) frameworks will be used. I want to play around with a couple of things I can't use for my day-to-day work, like Parcel, Open Props CSS, etc.

These will be marked as "features" and we'll be learning and working with them in the process of building the whole website.

Template

Template url -https://www.figma.com/community/file/877755494185998698

This is a free Figma template brought to you by the [Flowbase Team]! Support them here: 💜 Website @ www.flowbase.co 💜 Figma Plugin @ www.figma.co 💜 Webflow @ www.webflow.com/flowbase

Features

• 📦 Gulp
  • SASS compilation
  • Probably general file compression
• 🎨 Design tokens - our own SASS and CSS tokens
• 🖌️ Design system - based on Cube CSS methodology - Light/Dark theming - Media queries based on hover effects, etc.
• 🏗️ Interactivity
  • alpinejs for general stuff like nav, effects etc.
• 👀 Animations on scroll
  • AOS - https://michalsnik.github.io/aos
  • SAL - https://github.com/mciastek/sal
  • scrollmagic - https://scrollmagic.io
  • Intersection Observer API
• 🏋️ Lazy loading images
  • Native performance?
  • JS library?

Live coding sessions (Bulgarian language 🇧🇬)

TBD