ノーコード「Glide」で商店街Webアプリを作成

★この記事は10分で読み終わります。
ノーコードサービス「Glide」を使って近所の商店街の地図が表示できるWebアプリを作りました。

未経験くん

ノーコードってなに？

未経験ちゃん

社内用アプリを簡単に作りたいな〜

そんな人に向けた記事です。

実際に筆者が地図アプリを作った方法や必要なスキルをまとめて紹介していきます。

ノーコードとは

ノーコードとはコーディングを全く必要とせずアプリやWebサイトや作成できるサービスです。

現在では「ノーコード」「ローコード」「プロコード」といった種類でコーディングは分別されています。

開発スピードのメリット・デメリットと作られるプロダクトの自由度や拡張性などがよく比較に挙げられます。

今回は代表的サービス「Glide」を使ってみたいと思います。

Webアプリの作成手順

データの作成

Webアプリを簡単に作れるといってもデータがないと表示するものがありません。

具体的には、地図をマッピングするためには「住所」もしくは「緯度・経度」のデータが必要となりますよね。

今回は、Pythonを使ってWebスクレイピングをしています。

Webスクレイピングする対象は、近くの商店街が「天神橋筋商店街」です！日本一長いことで有名何ですよ！！笑

Webスクレイピングの詳しい方法は下の記事を読んでみてください。

Glideを使ってみる

Glideにアクセスして、私はGoogleアカウントで登録をしました。

登録が簡単すぎる。。。

登録をすると、下のような画面が出てきます。

地図アプリは「City Guide」を使います。

City Guideを選択すると、地図が表示されたアプリが出てきます。

下の画像のように[Edit Sheet]を選択すると、アプリに利用するデータの編集画面へと移動します。

データはGoogleスプレッドシートで表示されます！とても見やすい！

そして、Webスクレイピングで取得したデータをコピペします。
（注意：無料で地図にマッピングできるのが10件までなので今回は5件だけコピペしてます笑）

前のアプリの画面に戻り、画面右側の表示するデータをぽちぽちと選択してあげると、、、

自分で取得した店がマッピングされました！！！すごい早い笑

実際に作ったアプリのリンクを貼っておくので是非！

https://enigmatic-watch-3738.glideapp.io/

また、現役エンジニアである筆者が、「未経験からWebアプリを作るためのロードマップ」も書きました。

ぜひアプリ開発に興味がある方は読んでみてください。

まとめ

ノーコードを利用すると社内用や個人用に使うアプリを爆速で作ることができてしまいます。

なぜ社内用なのかというと、商業用向けとしてはやはりテンプレートすぎることが言えます。

やはり差別化が大事になる実際のサービスアプリとしては厳しいですが、「アプリの作成体験を得る」や「データを取得して見てみたい」といった目的にはとてもノーコードは適していると思いました。