AtCoder AC Steps:1行もコード書かずにWebアプリのモックアップをリリースしてみた
目次
結論
コードを1行も書く必要はないため,初心者にはお手軽に「何かできた!」という感覚は得られる.
実質45分程度(見た目の細かい調整は除く)でリリースまでできたことに感動した.
注:元記事にもあるように,現時点ではネイティブアプリには及ばない部分もある.動画再生はできないなどの制約も.
皆さまへのお願い
ACを阻んだ要因について,必要な項目もしくは不要な項目などがありましたら,ご一報いただけると幸いです.
このほかのご要望・ご指摘も大歓迎です.
試したこと
AtCoder AC StepsのモックアップをGlideとGoogleスプレッドシートを使って実装してみました.
手順は,1行もコードを書かずにネイティブアプリ(もどき)をリリースする7つのステップで丁寧に解説されているため,読んだ通りに進めるだけで公開までできました.しかも,コードは1行も書かずにここまでできるのが驚異的です.
前準備
AtCoder AC Stepsとは?
AtCoderで出題された問題について,AC(Accepted)できなかった要因について記録を取るアプリです.
利用方法:ACを阻んだ各要因について,どの程度達成できたか/できなかったかを★マークの数(多いほどACに近づいていることを表す)で記録します.
凡例の候補
解けず:問題を解けず.
発想:思いつけば比較的簡単.そう思いつきされすれば…
方針-着手:手も足も出なかった.
方針-詰め:途中まで考察できたものの,最後の詰めまで至らなかった.
理解:解説などを読んだが理解に時間を要したもしくは理解があやふや.
実装:考察できた(理解した)ものの,実装できなかった.
動機・狙い
AtCoderのコンテスト本番や過去問で解けなかった問題について,弱点を明確にする&克服するために記録を残すことを考えました.
需要があれば,Webアプリ化して公開できたらと考えています.
手順(ほぼ解説記事通りです)
事前準備:スプレッドシートを用意.
1. Glideにアクセス.
2. Create an appを押す.その後Sign Upを押し,Gmailのアカウントでログイン.
3. 画面左側にあるNew Appを押す.
4. 用意しておいたスプレッドシートを読み込む.
5. 見た目を調整.
ここに一番時間がかかりました.
大まかには,左側が「どんなことをしたいか」,右側が「その詳細を変更する」ことに対応
6. 任意のURLを決める.Settingを押すと,APP URLを入力できる.
7. リリースは,左下のopen appを押すだけ.
工夫した点
- ★マークのレーティング機能がなかったため,Choice(選択肢)と別シートに★マークを6種類用意して代用.
明日以降の課題
Webアプリとして公開できるように,基礎的な技術(HTML5,CSS3,Javascript,DB,Railsなど)を習得する.
将来的には,ユーザの★マークの統計を取る機能や,そこから現時点でのオススメ問題を提示するといった機能が提案できたらいいと考えています.