Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/danielbarion/instruct-contacts
A little application developed with Web Components using Lit-Element, Rollup, Stylus and a little bit of material design concept.
https://github.com/danielbarion/instruct-contacts
browserify concept jasmine lit-element rollup stylus webcomponents yarn
Last synced: 2 months ago
JSON representation
A little application developed with Web Components using Lit-Element, Rollup, Stylus and a little bit of material design concept.
- Host: GitHub
- URL: https://github.com/danielbarion/instruct-contacts
- Owner: danielbarion
- Created: 2019-08-19T14:00:09.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-04T08:25:27.000Z (about 2 years ago)
- Last Synced: 2024-05-01T19:48:17.306Z (8 months ago)
- Topics: browserify, concept, jasmine, lit-element, rollup, stylus, webcomponents, yarn
- Language: JavaScript
- Homepage: https://friendly-bose-005e60.netlify.com/
- Size: 811 KB
- Stars: 5
- Watchers: 3
- Forks: 2
- Open Issues: 9
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![Instruct Contact App](https://i.imgur.com/QLcwFP8.png)
## Instruct Contacts APP
Demo: [https://friendly-bose-005e60.netlify.com/](https://friendly-bose-005e60.netlify.com/)Recommended OS: `Linux`, `OS X`.
You can test this app in `Windows` but you maybe need install `linux sub system` or use `git bash` to improve compatility and execute scripts.### Informations
This project use [web components](https://developer.mozilla.org/pt-BR/docs/Web/Web_Components) concept to have a high performance like native elements.
All components are build with `HTML`, `CSS` (Stylus), `Javascript`.Behind the scenes we have a open source project [Lit-Element](https://lit-element.polymer-project.org/) that I'm contributing to the documentation.
* Components
> All components has a `wc` prefix* Modules
> All modules has a `instruct` prefix### Available Scripts
Before anything you need install all dependencies:- Yarn
```bash
yarn
```
- npm
```bash
npm install
```#### Development
```bash
yarn start
```
This command will run development steps into source code and serve with Browserify.#### Development
```bash
yarn start-stand-alone
```
If you prefer serve the app more static, you can use this command and use [serve](https://www.npmjs.com/package/serve) to access the app.
This command will run development steps into source code and will not run browserify.- NPM
```bash
npm i -g serve
```- Yarn
```bash
yarn global add serve
```Once that's done, you can run this command inside your project's directory:
```bash
serve build -l 3005
```Where `build` is the `folder` and `3005` is the `port`.
#### Production
```bash
yarn build
```
This command will run production steps (minify, uglify and no source map) and will not serve the app.
To test you can serve the app as your want in your server or use `serve` like the stand alone flow.#### Tests
First, add `Jasmine` to your enviroment, I strongly recommend add jasmine global:```bash
npm i -g jasmine
```Now you just need run the command below:
```
yarn test
```