angular5-example-shopping-app - GitLite

KO | EN

gitlite — search

#react #typescript #llm #go #golang #android #linux #docker #macos #java #awesome #awesome-list #mcp #open-source

angular5-example-shopping-app

(★ 126)

Angular 5 Example Shopping App + Angular Material + Responsive

파일 탐색기

최종 버전 다운로드 (.zip)

- ISSUE_TEMPLATE.md
- PULL_REQUEST_TEMPLATE.md
- app.e2e-spec.ts
- app.po.ts
- tsconfig.e2e.json
- - app-routing.module.ts
  - app.component.html
  - app.component.scss
  - app.component.spec.ts
  - app.component.ts
  - app.module.ts
  - app.translate.factory.ts
- - .gitkeep
- - environment.prod.ts
  - environment.ts
- - styles.scss
- favicon.ico
- index.html
- main.ts
- polyfills.ts
- test.ts
- tsconfig.app.json
- tsconfig.spec.json
- typings.d.ts
.angular-cli.json
.editorconfig
.gitignore
.travis.yml
CONTRIBUTING.md
karma.conf.js
LICENSE
package-lock.json
package.json
protractor.conf.js
README.md
tsconfig.json
tslint.json

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Angular 5 Example Shopping App + Angular Material + Responsive

> ### Made with :heart:

[![Join the chat at https://gitter.im/Angular-5-Example-Shopping-App/Lobby](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/Angular-5-Example-Shopping-App/Lobby)
[![MIT Licence](https://badges.frapsoft.com/os/mit/mit.svg?v=103)](https://opensource.org/licenses/mit-license.php)
[![Open Source Love](https://badges.frapsoft.com/os/v1/open-source.svg?v=103)](https://github.com/ellerbrock/open-source-badges/)
[![TypeScript](https://badges.frapsoft.com/typescript/love/typescript.svg?v=101)](https://github.com/ellerbrock/typescript-badges/)
[![Build Status](https://travis-ci.org/affilnost/angular5-example-shopping-app.svg?branch=master)](https://travis-ci.org/affilnost/angular5-example-shopping-app.svg?branch=master)

## [LIVE DEMO](https://affilnost.github.io/angular5-example-shopping-app/)
[![angular-example-shopping-app](https://goo.gl/kjy8Ph)](https://affilnost.github.io/angular5-example-shopping-app/)

## UI Description
The app provides a possibility to maintain shopping lists.

- Products can be searched with a search field
- Each product can be added to a shopping list
- Shopping list can be viewed
- Products can be removed from shopping list
- Name of shopping lists can be defined and changed
- User friendly design

API connection:
- App uses shutterstock.com API, but it can be easily changed to any other api

## Features
- Angular 5+
- Internationalization (translations)
- Routing
- Lazy loading (Shopping module)
- Material Design
- Custom loading page
- Responsive layout (flex layout module)
- RxJS/Observables
- Angular forms
- Http
- Scalable architecture
- Following the best practices!

## Environment installation
You need to have `Node.js` and `npm` installed on your PC/Mac.

Then just run `npm install` in the project's root.

## Development server

Run `npm start` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.

## Build

Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.

## Possible Issues / Improvements
* Pagination in the Product Search List
* Possibility to add multiple products (of one type) to the Shopping List and to change the count of every product
* Write tests
* Navigation: Add breadcrumbs, "Back" buttons

## Contributing
Please see the CONTRIBUTING file for guidelines.

## Deploying to GitHub Pages
`npm run deploy-to-ghpages`

## License
MIT

Enjoy :stuck_out_tongue_winking_eye: