SquareOne

What is this madness?

Well, it's some kind of starting point for a project, where you are basically starting from square one. Hence the name 😉

Goodies

You may ask "What's in the Box?" and here are some insufficient answers:

• .vscode settings and extension suggentions to get yu started
• webpack config for processing scss, twig, js and various assets
  • assets: svg sprite generator
• a solid scss starter which is split
• code quality galore: stylelint, eslint
• twig is templating language of choice ( easier integration in Sylius and Grav, plus it has pretty low frustration potential )

All those components are highly customizable, because nothing is hidden away. So explore its contents make it your own ☝️.

Other Stuff

Thanks

Some great inspiration (especially regarding implementation and option selection) was drawn from these Repositories:

• Pangolin
• Webpacker Plugin for Grav CMS
• eCentral Scripts

Great articles

• An Annotated webpack 4 Config for Frontend Web Development
• Organising webpack configuration for different environments

Further Reading and improvement opportunities

• ABEM. A more useful adaptation of BEM.
• Stop toggling classes with JS, use behaviour driven DOM manipulation with data-states
• CSS Grid Layout - New Terminology
• Inclusive Components
• When Is A Button Not A Button?
• The Vanilla JavaScript Repository
• Dark Theme in a day
• JAM Stack
• An Extensive Guide To Progressive Web Applications
• Felipe - Turn Wireframes to UI
• The Power of Web Components
• Improving CSS grid workflow with SASS
• Fluid Typography
• We use too many damn modals. Let's just not.
• 9 amazing PWA secrets
• GRID: A simple visual cheatsheet for CSS Grid Layout