DashCow web

DashCow Web is a web interface for DashCow service. It provides handy dashboard which allows pasture owners to manage and track cows easily.

• DashCow web
  • Roadmap
    • v1
  • Development Guide
    • Requirements
    • Installation
    • Run project
    • Build project
    • Test
    • Lint Typescript/Javascript
    • Lint styles
    • Lint all
    • Format
    • Fix all lint and formats
    • Run storybook
    • Build storybook
    • Deploy storybook to GitHub page
    • Contributing
    • Learn More

Roadmap

v1

• Show herd statistic
• Search cow
• Show cow list
• CRUD cow data
• CRUD herd category
• CRUD event data

Development Guide

Requirements

• Node: 8.16+
• npm: 5.2+

Installation

To install dependencies of the DashCow web:

npm install

Run project

To run the app in the development mode:

npm start

and open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.

You will also see any lint errors in the console.

Build project

To builds the app for production to the build folder:

npm run build

It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.

Your app is ready to be deployed!

See the section about deployment for more information.

Test

To launch the JEST & Testing Library test runner in the interactive watch mode:

npm test

See the section about running tests for more information.

Lint Typescript/Javascript

To lint all Javascript related files including js, jsx, ts, tsx with Eslint:

npm run lint:es

Alternatively, to fix all fixable JavaSript related lint errors in js, jsx, ts, tsx with ESLint:

npm run fix:lint:es

See ESLint for more details.

Lint styles

To lint all CSS related files including css, scss, sass, less with StyleLint:

npm run lint:style

Alternatively, to fix all fixable CSS related lint errors including css, scss, sass, less files with StyleLint:

npm run fix:lint:style

See StyleLint for more details.

Lint all

To lint all JS and CSS files including js, jsx, ts, tsx, css, scss, sass with ESLint and StyleLint:

npm run lint

Alternatively, to fix all fixable JavaSript and CSS related lint errors including js, jsx, ts, tsx, css, scss, sass with ESLint and StyleLint:

npm run fix:lint

See Lint Typescript/Javascript and Lint styles sections for more details.

Format

To format JavaScript, CSS, HTML, JSON and markdown files with Prettier:

npm run fix:prettier

See Prettier for more details.

Fix all lint and formats

To fix all fixable JavaSript and CSS related lint errors and format files:

npm run fix

See Lint Typescript/Javascript, Lint styles and Format sections for more details.

Run storybook

Storybook app shows all UI components in DashCow web, it's a nice way test and check UI components.

To runs storybook app:

npm run storybook

and open http://localhost:9009 to view it in the browser.

The page will reload if you make edits.

You will also see any lint errors in the console.

See Storybook for more details.

Build storybook

To build storybook app to the storybook build folder:

npm run build-storybook

and the storybook app is ready to be deployed!

See Storybook for more details.

Deploy storybook to GitHub page

To deploy storybook app to current GitHub repositories' GitHub page:

npm run deploy-storybook

and open http://dashcow.github.io/dashcow-web to view it in the browser.

Alternatively, to deploy storybook app to other remote GitHub repositories' GitHub page:

npm run deploy-storybook -- --remote=[your-remote-repo-name]

and open http://[username-or-group-name].github.io/dashcow-web to view it in the browser.

See Storybook deployer for more details.

Contributing

Please follow Angular Commit Message Conventions for git commit logs.

Learn More

This project was bootstrapped with Create React App, so you can learn more details in the Create React App documentation.