ARCHIVE: For EmberConf 2022! Storybook, TDD, Accessibility, and more - example code.
.storybook | ||
app | ||
config | ||
public | ||
stories | ||
tests | ||
vendor | ||
.editorconfig | ||
.ember-cli | ||
.eslintignore | ||
.eslintrc.js | ||
.gitignore | ||
.prettierignore | ||
.prettierrc.js | ||
.template-lintrc.js | ||
.travis.yml | ||
.watchmanconfig | ||
ember-cli-build.js | ||
package-lock.json | ||
package.json | ||
README.md | ||
testem.js |
Thinking in Stories: Component-First
This is an example Ember app that was the result of live-coding at EmberConf 2022 focusing on Storybook and tests. This code is not intended to deploy in any meaningful capacity and is supplied merely as a reference and playground.
This readme explains how to get started with this project as well as lists all links referenced in the conference talk.
Prerequisites
You will need the following things properly installed on your computer.
Installation
git clone <repository-url>
this repositorycd emberconf-2022
npm install
Running / Development
Ember
ember serve
- Visit your app at http://localhost:4200.
- Visit your tests at http://localhost:4200/tests.
Storybook
npm run storybook
Code Generators
Make use of the many generators for code, try ember help generate
for more details
Running Tests
ember test
ember test --server
Linting
npm run lint
npm run lint:fix
Building
ember build
(development)ember build --environment production
(production)
Further Reading / Useful Links
- Author notion doc for talk (has abstract, outline, key snippets etc)
- Author Portfolio
- Storybook - What's a Story
- Storybook - Install (switch to "Ember")
- Storybook configuration snippet referenced (or see it in this repo under
.storybook/main.js
) - TailwindCSS
- Tailwind UI Contact Card (note, this is behind a paywall and assumes a Tailwind UI subscription)
- Ember Template Imports
- Glint #ember-components
- Ember Blueprints
- Ember CLI Storybook