大阪府のゴールドステッカーを地図上に表示するアプリケーション
License: MIT License
Issue にある色々な修正にご協力いただけると嬉しいです。
詳しくはサイト構築にあたっての行動原則を御覧ください。
本ソフトウェアは、MIT ライセンスの元提供されています。
| ツール | バージョン |
|---|---|
| Node.js | v16.14.2 |
| npm | 8.5.0 |
| yarn | 1.22.18 |
develope に commit されると開発環境にデプロイされます
地図部分は Mapbox を利用しています。 開発時にはアカウントを作成し、環境変数 TOKEN に token を設定してください。
export TOKEN="XXXXX";
# install dependencies
$ yarn install
# serve with hot reload at localhost:3000
$ yarn dev
# build for production and launch server
$ yarn build
$ yarn start
ローカルで動かしていたものを反映
ロジックのバグというよりはデータの問題ではあるのですが、気になる挙動がありましたので報告させていただきます 🙇
data.json で保持している各店舗のホームページ情報( .features[].properties.hp ) にURLとしては不正な文字列なものが含まれており、その場合にリンクが404になってしまったりするようです。
確認できたものですと、例えば http始まりとなっていない場合に、以下のように相対パスとして解釈され、nuxtデフォルトの404画面が表示されてしまいます。
実際のリンク例
https://covid19-osaka-map.info/tabelog.com/osaka/A2701/A270103/27119004/
リンクで遷移すると Nuxtの404画面
以下のいずれかの対応が出来れば、ユーザー体験が向上するのかなと思いましたので参考としてご検討頂ければと思います。
(どちらかといえば一部は改善提案的な内容になっているかもしれません 🙇 )
- data.json内でホームページ情報のURLが不正なものを確認
上記のURLが不正なデータの確認としては、例えばhttp始まりでないもので見てみるのは以下で確認ができます (この条件でみてみると現状で 878件存在するようです)
$ cat data/data.json| jq '.features[].properties.hp' -r | grep -v '^$' | grep -v '^http' | wc -l
React
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
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
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.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.