cichy380 / travelmaker Goto Github PK
View Code? Open in Web Editor NEWMulti directions route manager for each day of the week
License: MIT License
Multi directions route manager for each day of the week
License: MIT License
SCSS files structure and theming system based on https://indepth.dev/tutorials/angular/angular-material-theming-system-complete-guide
Helpful materials:
Form validation based on API response with collection of form fields with errors
Add endpoint and correctness validation of data sent:
/destinations/<ID>
to edit existing item (Destination)
Browser app as native device app:
PWA
config Service Worker to cache request GET /destinations/{{USER-ID}}
clear SW cache when new Destination item is added/edited/deleted
DestinationModule - structure for main Nestjs module with first endpoints
/destinations
/destinations/<ID>
reorderable collection by draggable elements Drag and Drop module (@angular/cdk)
modifications to the Manifest file
Shortening variable names
DestinationFormComponent
(create DestinationEditFormComponent
and DestinationAddFormComponent
)editDestination
actionForm component must implements CanDeactivate
and if form has unsaved changes and user want to leave it app needs show ConfirmDialog
.
Create module GoogleMaps providing service to generating URL to Google Map with driving directions. URL should be available in big button below Directions list.
DestinationFormComponent
addDestination
actionAdd endpoint:
/destinations
to create new item (Destination)
It is a service for displaying snack-bar error notifications:
...maybe:
Add endpoint:
/destinations/<ID>
to remove item (Destination)
Form controls enhanced by a panel of suggested options based on values from state.
Component: Autocomplete
Animated information that request is pending.
For all requests:
and when Destinations is not loaded yet, we will display the Destinations list instead:
In DestinationsComponent
list of Destinations create by ngFor
with trackBy
:
<travelmaker-destination-list-item *ngFor="let dest of destinationsOfSelectedDay; trackBy trackByDestId" />
in controller:
public trackByDestId(_, destination) {
return destination.id;
}
Dedicated View if Destinations List on some day is empty
Create empty, initial NestJS application inside Travemaker project.
npm install -D @nrwl/nest
nx g @nrwl/nest:app api --frontendProject travelmaker-app
Endpoint to change order of items (Destinations):
/destinations
body: [ID1, ID2, ID3]
removeDestination
actionCSS scrolling shadows:
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.