covuworie / making-a-single-page-app-without-a-framework Goto Github PK
View Code? Open in Web Editor NEWMaking a single page app without a framework
License: MIT License
Making a single page app without a framework
License: MIT License
Create a model for the Phone
.
Add routing for the filter
functionality. Instead of using json
in the url use the standard approach for form submission where key value pairs are used.
Add the filter routing functionality.
Render the phones
to make active and inactive based on the filtered selections.
Render all the phones when the application loads.
Add an event listener to the Clear filters
button that unchecks all the checkboxes and re-renders the phone list.
Add dependencies and configuration files for node
, typescript
, webpack
and git
.
Listen for when the user clicks on a phone and render the single page details. Listen for when the user closes the single page and show the all products
page.
Commit initial code.
Add 404 page when no matching route is found.
Redirect to 404 page when invalid query is entered.
Create a method to load all phones from a Phones
collection.
Add a backbone
router for product and direct navigation.
Had to revert back to fragment
based routing as direct navigation was seriously messed up with push state
based routing. In the onbeforeunload
event it is impossible to get access to the target url due to privacy concerns (you have no idea where the user is going => they could be navigating to another site).
The ajax request for the page fires and of course being a single page application that resource is not found. I might see later if there is a way to rewrite the url behind the scenes but maintain the correct browser history.
Rant over.
Allow optional trailing slash on product.
Add javascript code.
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.