This app is meant to enable weather nerds to look at weather-related data for a given location. Simply type in a location address or name, select it, enter a date/time and view the precipitation data your heart desires.
- Bootstrap
- Although there are various newer, "sexier" options, Bootstrap is tried and true and simple to implement. One goal of this project is to have as minimal a back-end as possible; CSS libraries such as Semantic UI benefit more from additional Gulp scripting for theming and configuration, which I wanted to avoid. Finally, the Bootstrap Angular UI is well established and useful.
- Karma / Jasmine
- Established libraries for running front-end tests.
- Leaflet
- Necessary for displaying maps.
- Angular UI Router
- I like the extra robustness that this module adds over angular's default routing capabilities. (Nested states etc.)
- Plotly
- Used for charting temperature on weatherdata page
- root // contains configuration files, readme, and basic node server
- app // client code, organized by feature (rather than by file type) + styles (under "assets") and index.html
- core // core modules -- these are "shared" modules that aren't tied to one feature
- layout // layout files, such as header directive
- lib // lib files that aren't managed via bower and/or their their angular wrappers
- main // main page files (this is the page you land on when you open the app)
- weather // weather page files (the page that displays data for a selected location)
- maps // map service files, logic concerning the map and related leaflet/mapbox data
- e2e-tests // config for integration testing (currently unused) and mock data
- app // client code, organized by feature (rather than by file type) + styles (under "assets") and index.html
- ES6 / Babel
- One of the highest priorities would be getting newer JavaScript features into the project.
- LESS (Or SASS..)
- Using a CSS preprocessor would be necessary for keeping the CSS manageable. Ability to use variables and functions etc. are necessary in almost anything that isn't a prototype over the long-term.
- Packaging (Minification/uglification, optimization, etc.)
- As we think more about a production application, a packaging step would need to be implemented.
- Code linting/vetting
- Enforcing a uniform and clean code style is easier if linting systems such as JSCS are integrated in the project's scripting (i.e. runs when serving or testing).
- error-handling and edge cases, validation
- It's pretty easy to break the app right now by doing silly/unexpected things -- e.g. not filling in a date/time. A production app needs significantly more error-handling, validation, notification of bad input, etc.
this notation
means run this command from root directory (unless another directory is specified)
- built on a system using node v4.4 *
To install. (Need NPM and Bower, preferably latest stable versions)
- Clone project
npm install
bower install
To run.
node server.js
- server will start on port 3000
- navigate from your web browser (modern Chrome/Firefox/Edge) to localhost:3000
To test.
npm test
To build (wire up new css/js files, including Bower dependencies)
gulp build
Some other documentation was created in support of this project. Note: not necessarily adhered to 100%