- Published on
Rails URLに現在地と目的地を入れてリクエストすると距離を返してくれるアプリ
1083文字2分で読めます–––
閲覧数
- Authors
- Name
- Shou Arisaka nyapp.buzz/shou
- short bio
- Z世代の情報技術者。Next.jsで自作SNSを個人開発中。
そんな感じのアプリをRailsで作ってみました。
Railsで作ったアプリでは1番しっくりくる、最初のアプリですかね…。今まではコピペでブログとかscaffoldばっかしてたので。
もともとPHPで作ったものをRailsで動くようにしたってだけなので、そう時間はかかりませんでしたが。練習としてやってみました。
// routes.rb
get 'userinfo/show/:here/:dist' => 'userinfo#show',as:'userinfo_show'
// userinfo_controller.rb
def show
Encoding.default_external = 'UTF-8'
require 'json'
require 'open-uri'
@here = params[:here]
@dist = params[:dist]
# @here = 'æ±äº¬'
# @dist = '大阪'
url="https://maps.googleapis.com/maps/api/distancematrix/json?origins=#{@here}&destinations=#{@dist}&mode=walking&language=ja&key=YOUR_API"
puts @obj = JSON.load(open(URI.encode(url)))
@destination_addresses= @obj['destination_addresses'][0] ;
@origin_addresses= @obj['origin_addresses'][0] ;
@km= @obj['rows'][0]['elements'][0]['distance']['text'] ;
end
// show.html.erb
<p>現在地: <%= @origin_addresses %> </p>
<p>目的地: <%= @destination_addresses %> </p>
<p>距離: <%= @km %> </p>
Google Maps APIを利用しています。
YOUR_APIをご自分のものに変えてください。
これで、http://localhost:3000/userinfo/show/東京/大阪にアクセスすると、
<br />現在地: 日本、東京都東京
目的地: 日本、大阪府大阪市
距離: 493 km
こんな感じで、表示してくれます。
15歳でWordPressサイトを立ち上げ、ウェブ領域に足を踏み入れる。翌年にはRuby on Railsを用いたマイクロサービス開発に着手し、現在はデジタル庁を支えたNext.jsによるHP作成やSaaS開発のプロジェクトに携わりながら、React.js・Node.js・TypeScriptによるモダンなウェブアプリの個人開発を趣味でも行う。
フロントエンドからバックエンドまで一貫したアジャイルなフルスタック開発を得意とし、ウェブマーケティングや広告デザインも必要に応じて担当、広告運用・SEO対策・データ分析まで行う低コストかつ高品質な顧客体験の提供が好評。
国内外から200万人を超える人々に支えられ、9周年を迎えるITブログ「yuipro」の開発者、デザイナーでありライター。現在ベータ段階の自作SNS「nyapp.buzz」を日本一の国産SNSとするべく奮闘中。
何かご質問がありますか？
