michaelwooley/bhw-svelte

Weather example app - Svelte version

Weather app - svelte

Svelte typescript SPA demo/boilerplate

Features

• Typescript
• Storybook
• Import aliases
• CLI for common tasks
• Deploy to GitHub pages on commit to master
• Demo service calls w/ unit tests (jest)
• Component testing

Development

Typescript setup

conversion script

Add a new directory alias

In order to work through tests, typescript, and, compilation need to update three files:

1. package.json in jest.moduleNameMapper
2. rollup.config.js in plugins.alias ~> entries
3. tsconfig.js in compilerOptions.paths
4. .storybook/main.js in alias

Each alias field has its own special way to do things. Follow what is already there.

Links

• bulma tooltips
• bulma

bhw-svelte's Issues

Stations Latest Observation API call

• Pattern. https://api.weather.gov/stations/:station/observations/latest
• Example. https://api.weather.gov/stations/KBVI/observations/latest

Assignees:
Labels:

CityBlockDropdown action handlers

Remove localForage if unused

Add favicon, manifest

Better rounding on statistics

See, e.g., CityCurrentWeatherStat for what is currently being done.

Add weather data store

• Call requests from here
• Cache data from here

Add CI to deploy site

Better unit conversions

• Celcius to fahrenheit
• Meters to feet/miles
• Settings for this

Add navbar

• Basic logo
• Modify modal button

Assignees:
Labels:

Weather timeseries chart proper (display)

Actual chart with data, etc. passed in.

• Control y axis
• Control x axis - Date handling
• Colors?
• Tooltip w/ value and date

Assignees:
Labels:

Add CLI outline

• Working in bin
• Has "init" program outlined.

Assignees:
Labels:

City weather block (dumb)

Placeholders for:

• Name
• Weather stats
• plot

Assignees:
Labels:

City search API

https://search.osmnames.org/us/q/cin.js?key=dgb7TgC5zR0YpsAqbEgb

Assignees:
Labels:

Add city chart component

Stations Observations (historical) API call

Pattern is:

https://api.weather.gov/stations/:station/observations?start={Date}&end={Date}&limit={number:50}

Example:

https://api.weather.gov/stations/KBVI/observations?start=2020-09-10T17%3A15%3A00%2B00%3A00&end=2020-09-16T17%3A15%3A00%2B00%3A00&limit=50

Assignees:
Labels:

App footer

Add city select modal

• Create BaseModal component
• Create Modals container to handle all modals show/hide
• Create CityModal Component that outlines where two elements should go
• Create CityModalSearch Component to search/add new cities
• Create CityModalOrder Component sorts/refreshes current cities
• Create CityModal container w/ BaseModal and above two components. Linked w/ store.

Add time series data to weather data store

simple extension on #18

Current weather column (display)

Show curent weather stats

Assignees:
Labels:

Update CityBlock-related containers

• Hook dropdown into CityBlock
• Add actions to dropdown component
• Add current weather to the CityBlock container
• Display all active Blocks in actual App
• Add "no cities selected" handler to CityBlockList container
• Update dropdown list (disabled ~> isFirst, etc.)
• Update dropdown story to use a view

---

• ❗ Since the graph is not done yet, cannot really "complete" this yet