Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/n1k0/elm-kitten
Create an SPA using Elm and SASS.
https://github.com/n1k0/elm-kitten
elm ria sass scss spa
Last synced: about 2 months ago
JSON representation
Create an SPA using Elm and SASS.
- Host: GitHub
- URL: https://github.com/n1k0/elm-kitten
- Owner: n1k0
- License: other
- Created: 2021-08-17T13:34:40.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2021-08-21T21:32:11.000Z (over 3 years ago)
- Last Synced: 2024-10-08T04:22:01.987Z (3 months ago)
- Topics: elm, ria, sass, scss, spa
- Language: Elm
- Homepage: https://n1k0.github.io/elm-kitten/
- Size: 85 KB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# elm-kitten
This project has been forked from [elm kitchen](https://github.com/allo-media/elm-kitchen), which has been unmaintained for more than a year now.
> This is a modest attempt at providing a simplistic yet opinionated Elm [SPA](https://en.wikipedia.org/wiki/Single-page_application) application skeleton based on rtfeldman's [Elm Example SPA](https://github.com/rtfeldman/elm-spa-example/), for [Allo-Media](http://tech.allo-media.net/)'s own needs.
[Check for yourself](https://n1k0.github.io/elm-kitten/)
## Features
- Elm 0.19.1 ready
- Multiple pages navigation & routing, based on URL fragments
- [SASS](https://sass-lang.com/) support with [Bootstrap 5.1](https://getbootstrap.com/docs/5.1/) integration
- Live development server with hot reloading (Elm + SASS)
- [elm-test](https://github.com/elm-community/elm-test) support
- JavaScript build minification & optimization using UglifyJS.
## Code organization
The application stores Elm source code in the `src` directory:
```
$ tree --dirsfirst skeleton/src
src
├── Data
│ └── Session.elm
├── Page
│ ├── Home.elm
│ └── SecondPage.elm
├── Request
│ └── Github.elm
├── Views
│ ├── Page.elm
│ └── Theme.elm
├── Main.elm
└── Route.elm
```
Richard Feldman explains this organization in a [dedicated blog post](https://dev.to/rtfeldman/tour-of-an-open-source-elm-spa).
## Installation
```
$ npm install -g elm-kitten
$ elm-kitten my-app
$ cd my-app
$ npm install
```
## Usage
To start the development server:
```
$ npm start
```
This will serve and recompile Elm code when source files change. Served application is available at [localhost:3000](http://localhost:3000/).
## Tests
```
$ npm test
```
Tests are located in the `tests` folder and are powered by [elm-test](https://github.com/elm-community/elm-test).
## Build
```
$ npm run build
```
The resulting build is available in the `build` folder.
## Deploy
A convenient `deploy` command is provided to publish code on [Github Pages](https://pages.github.com/).
```
$ npm run deploy
```
## License
[MIT](https://opensource.org/licenses/MIT)