【第2弾】KADAI INFOアップデート情報【リリースノート】
はじめに
どうも、「KADAI INFO」でエンジニアしている中原です!
今回は鹿児島大学生向けの神アプリ「KADAI INFO」を神のみぞ知るレベルにアップデートしたので情報公開するぜ!
ちなみに、以前のアプリ情報についてはこちらからどうぞ!
記事閲覧
こちらの機能では、再・追加読み込みする際に読み込んでることが見た目的にも分かるようにしました!
「コイツ何言ってんだ?」そう思いましたね。百聞は一見に如かず。具体的な画像を見せるぜ!
上の画像の赤い線で囲んである部分。いろんなアプリでよく見るこれ!
これ勝手についてくるんじゃなくて、ちゃんと実装しないとできないやつなんです!!
とりあえず、これを実装したことでエラーが出たときも画面更新できるし、追加で記事読み込んでるときも読み込んでることが分かるので気持ち的に楽に感じれるようになったかと思います!
時間割
時間割機能がついに実装されましたー!!!
こんなかんじで「講義名」と「場所」をすぐに確認できるシンプルなものしてみました!
コマをタップすると右の画像のように詳細を確認することができます!
講義を登録する方法は簡単で、「登録したいコマ部分をタップ」→「編集をタップ」で素早く編集画面にうつることができます。
登録する項目は「講義名」「教室」「教員」です。それと・・・
自分の好きな色も選べるんだなこれが!現在登録できる色は右の画像の通り!!是非自分好みの時間割にカスタマイズしてみてください!
サークル一覧
こちらも新機能!!鹿児島大学で活動しているサークルをすぐに確認できる機能なんですが、画像のように好きなジャンルから探すことができます!
さっそく気になるジャンルをタップしてみるぜ!
さあ、自分はやはり開発が好きなので「メディア・情報」を選んでみました!
ふむふむ、思ったより多いな。
今書いてるこの記事のために、この中から1つ選ばないといけないのか・・・難しいけど頑張って絞るぜ!
おっと!これはこれは偶然にも「KADAI INFO」!
鹿児島大学にはこんなにもおもしろそうなことをしている神サークルがあったのか!
いやー、この神アプリのおかげで神サークルも探すことができちゃいましたわ。あっぱれあっぱれ!
学生証リーダー
さあさあ、この機能。鹿児島大学の学生証についているプリペイド残高を読み取ることができるんです!!
よくあるこのようなアプリは「suica」「nanaco」といった有名なやつは読み取れるんですが、学生証のプリペイド残高には対応していません!!
し・か・し
KADAI INFOアプリでは画像のように自分の学生証にかざすと「残高」「利用履歴」を素早く確認することができます!
おっと、分かりやすいように自分の学生証を読み込んだ画面をのせてしまったせいで、私が億万長者であることがバレてしまった!
最後に
第2弾のくせにアップデート情報盛りだくさんですみません!
今後もKADAI INFOアプリは進化していきますので、どうぞよろしくお願いします!
では!
【PV数を回復】便利なようで苦しめられたAMP
どうもです! KADAI INFO 代表のみっちゃん(満園大輔)(@mitsuzono_kadai)です。
鹿児島大学大学院の1年生で情報系を学んでおります。
現在、僕はKADAI INFOの代表をしておりますが、
昨年は副代表として、そしてエンジニアを兼務しておりました。
今は代表となり、営業に行ったり、動画撮影をしたり、、、と忙しい毎日を過ごしております。
そんな中でも、足りないところには入って開発を続けています。
今回は最近、KADAI INFOの中で1番の問題となっていた
PV数の低下
をTechの力で原因解明と解決したお話をしたいと思います。
AMPとは
この問題を改善する上でまずは、AMPを知っておかなくてはなりません。
AMP(Accelerated Mobile Pages)とは、モバイルページを高速に表示させるための手法のことです。
このAMPはGoogleとTwitterが協同で開発したものであり、「サイトの読み込みに時間がかからない」ために開発されています。これはWebページの表示速度がユーザのサイトへの直帰率に起因するというものからです。そのため、文字や簡単な画像だけを拾って再構築したWebページを表示するため、必要な情報が素早く見れるというわけです。
高速表示化の仕組み
通常は、Googleなどの検索結果から出てきたリンクをクリックすると、Webサーバ上にある情報を読み込んでから表示します。そのため、表示に時間がかかります。
ですが、AMP対応のWebページだと、あらかじめGoogleやTwitterのサーバにキャッシュする(Webページのデータを一時的に保存する)ことで、リンクをクリックしたときに、通常はサーバにデータを読みに行くところをあらかじめ用意しておいたキャッシュを表示させ、読み込み時間を大幅に削減しています。
出典:AMPって何?仕組みを知って快適にページを閲覧しよう : ビジネスとIT活用に役立つ情報
メリットとデメリット
ここまで聞いていると、AMP最高じゃん!使わない手はないじゃん!と思うかもしれませんが、AMPの落とし穴もあるのです。
メリット
・高速にWebページを表示できる。
・Googleの検索上位になりやすい。
Googleさんも公式にAMP対策した方が検索上位になりやすいよ〜とやんわり言っているので、確かなのでしょう。
デメリット
・Google Adsenseが表示されない。
・Webページの形が崩れる。
・別URLになるためPV数のカウントがされない。
そうなんです!!!!!
ここが1番の問題なんです。
私たちKADAI INFOの収入源の1つにGoogle Adsenseがあります。さらにTwitterからの閲覧者が多い中、AMP側のURLに行かれたら見られていないことと一緒!
最近、なんでかPV数少ないなぁ。少ないなぁと悩んでいたんですよ。
こいつのせいだったかと。。。
AMPは便利なようで私たちにとっては敵です。
これで解決
Twitterから個別でAMPを外す設定はできますが、こちらからお知らせしても全員が外すわけないですよね。
ならば、こっちから外しにいってやろうと、、、、
でもGoogle様とTwitter様が推奨するAMPをそう簡単に外すことはできない。
そうか!
AMP表示させたと見せかけて、本来のURLにリダイレクトすることで解決すればいいのね。
つまり、AMPに飛ばされるURLはこんな感じhttps://kadai-info.com/2016/12/04/mochikoshouse/amp/?__twitter_impression=true
URLの後ろにいらない/amp/?__twitter_impression=trueがくっついている。本来、アクセスしてほしいURLはhttps://kadai-info.com/2016/12/04/mochikoshouse こっちなんですね。
/amp/?が入るURLがある時は、そこから後ろを無くしたものに再アクセスするようにこちらが設定すればいい。
(*これをフィッシングなどに悪用したらダメですよ〜)
Wordpressのファイルには「.htaccess」というディレクトリごと一気に変更できる設定ファイルがあるので(*こういう緊急事態の時以外はあまり触らない方がいいです)そこにリダイレクトするための記述をします。
RewriteEngine On RewriteBase / RewriteRule ^(.*)amp/?$ $1 [R=301,L]
こんだけ!便利ですよね〜。 /amp/?が付いているURLはそれ以降を省いたURLにリダイレクトさせましょうということです。
301というのは、「301リダイレクト」と言って、ホームページのお引っ越しとかそういう時によく前のURLにアクセスしたら、自動転送されますが、その転送手法ということです。
これにて、本来のアクセスしてほしいURLへとユーザを飛ばすことができたので、めでたし。めでたし。となります。
Google Analyticsに感知されるようになったのでPV数も安泰だし、Google Adsenseも表示されるようになったので安泰です。
みっちゃん代表がKADAI INFOの安全と平和を取り戻したお話でした。おしまい。
【参加報告】さくらじまハウス2020でLT登壇してきました【せりちゃんver.】
皆様、初めまして!
KADAI INFOエンジニア部唯一の女子メンバー、副エンジニア長せりちゃんことセリナ(@serina_ponpi)と申します。
2月6日-7日に鹿児島のエンジニアイベント“さくらじまハウス2020”が開催され、エンジニア部メンバーが参加してきました。
その中でも私セリナとがんがんさんの2人はLT登壇をしてきましたのでその様子をレポートしていきます。
さくらじまハウス2020とは?
さくらじまハウスは、最前線で活躍されている様々なエンジニアのセッションが聞けるITカンファレンスです。
こちらが公式サイトです↓
誰でも参加できるイベントで、エンジニアの方だけでなく学生の参加もできます。
INFOエンジニア部以外にも鹿児島大学の生徒が数名参加していました。
(がっつりテスト期間中だったのでみんなテストを避けてきていました)
今回は2年ぶりの開催で、100名近くの方が参加していました。
私は少し早めに会場入りして前から3列目に座ったためとても見やすかったです。
全体としてはこんなにたくさんの方々がいらしゃっていました。
たくさんの方々に来ていただきました!明日もあります!!#さくらじまハウス2020 pic.twitter.com/mN7a5q9deN
— Yuki Okubo (@yukiii__0306) 2020年2月6日
鹿児島県内のIT企業の方はもちろんのこと、東京からいらっしゃった方、フリーランスで働いている方など幅広いエンジニアの方が参加していました。
普段はなかなか会えないような現役エンジニアの話が直接聞ける、鹿児島では貴重なエンジニアイベントだったと思います。
将来エンジニアを目指す学生にとって、とても刺激のもらえるイベントであり、新しい技術に触れられるイベントとなりました。
各セッションのおはなし
さくらじまハウス2020は、「エンジニアとしての生き方」がテーマでした。
時間ごとにセッションが分かれており、特定の分野で活躍されている方やさまざまな働き方を実践されているゲストとのパネルディスカッションがありました。
学生という立場からすればわからない話も多かったですが、メモをとりながら聞き、講義があった分野の話は比較的ついていけたものもありました。
私は2日目のみの参加でしたが、特に「レガシーコードへ立ち向かう」というセッションが印象に残りました。
「 レガシーコードとはなんぞや?レガシー=遺産?昔のコード?」と初耳状態で参加してぐぐってたんですが、必ずしも古いコードということではないようでした。
ぐぐってみるとこのように出てきました。
「レガシーコード」という言葉を「何年も前に誰かが作り、内容が複雑で何をしているのかよく分からず、まともな仕様書もないコード」いうコードを指すものとします。ー開発者のための実装系WebマガジンCodeZineより
古いことが多いのでしょうが、理解しづらい・変更しにくいコードまたはテストのないコードであり、”改善すべきコード”というように私は捉えました。
このセッションは、
の3人が登壇し、実際の現場で起こりうるレガシーコードへの向かい方のお話をしてくださいました。
実際の開発現場では、何十年も運用されていたり何十人も開発に関わっていたりすると“誰もわからないコード”というのが存在するようです。
大学ではそのような大規模な開発に関わることもないし、研究をまだ始めていない私は自分のコードや先生の示したコードについて考えるだけなので触れたことのない世界でした。
そのようなレガシコードはシステムの脆弱性となることから、にしむねあさんからはセキュリティ面での話がありました。
ちょうど「情報セキュリティ」講義を受けていたタイミングだったので現場の話が聞けたことは貴重の経験だったと思います。
本当はプロダクトごとにセキュリティ担当がいるのが理想ですが、プロダクトが多いとそうもいかず横断的にセキュリティを見ていく体制になっているようです。
そのような開発体制の話も大学にいては触れない話で新鮮でした。
また、通常はアプリケーションよりデータベースのほうが長く使われることが多くレガシーなものが多いことからそーだいさんからはデータベースの話がありました。
そこではまたもや初耳の"リファクタリング"という単語が出てきました。
リファクタリング(refactoring)とは、コンピュータプログラミングにおいて、プログラムの外部から見た動作を変えずにソースコードの内部構造を整理すること である。ーwikipediaより
データベースは一度動かしてしまうと止めることが難しく、書き換えて壊れたらかなり困ることになるのでリファクタリングが進まないそうです。
20年もののDBなど珍しくなく、テストもできない状態であるため、まずはテストができる状態にすることやそうならないために設計するときはしっかりと考えて設計を行うことが重要であるというお話がありました。
また、テストは「一度に完璧なものをつくろう」「一気にしよう」とするのではなく、小さなものから少しずつ改善、テストをするとよいとのことでした。
INFOエンジニア部でもネイティブアプリ開発をしているのでその知識は役に立ちそうです。
まんたろうさんからはレガシーコードをうまないために「コミットのコメントを工夫して過去を見やすくする」とよいという話もあったので私も気を付けていこうと思います。
他にもマイクロサービス化についてのセッション、多様化するエンジニアとしての生き方を語るセッションがあり、どれも興味深いものでした。
LTの感想
さくらじまハウス2日目にはLTの時間が設けられていました。
LTはLightningTalkの略で、5分程度の短いプレゼンのことを指します。
エンジニア業界ではこのようなカンファレンスや就活イベントなど様々な場所で行われています。
今回は学生3名を含む計11名が5分ずつどんどん交代しながら話していきました。
私は「KADAI INFOエンジニア部の取り組み -鹿児島大学をもっとおもしろく-」と題してお話させていただきました。
2人とも #さくらじまハウス2020 のLT発表頑張りました!
— 満園大輔 @KADAI INFO 代表 (@mitsuzono_kadai) 2020年2月7日
個人としてKADAIINFOとして開発していることを鹿児島のエンジニアにお伝え出来ました😊
せりちゃん(@serina_ponpi)
がんがん(@gangan_nikki)
お疲れさま〜!! pic.twitter.com/edCOUAaZhh
私はエンジニアコミュニティやサークルでLTは何度かしたことがありましたが、100人のエンジニアの前でするのは初めてのことでド緊張.....。
以下が発表資料です。
鹿児島大学めちゃめちゃやってる
#さくらじまハウス2020 pic.twitter.com/muAuIeYKNl— はやぴ (@hayapi_ppb) 2020年2月7日
LT-⑨ KADAI INFOエンジニア部の取り組み -鹿児島大学をもっとおもしろく- By 加藤 瀬里菜[鹿児島大学/KADAI INFO]
・KADAI INFO : 鹿児島大学をもっと面白くする!
・モバイルアプリ開発してます!
・テックブログも始めます!#さくらじまハウス2020 pic.twitter.com/nmuQXMz6ao— kusokamayarou (@kusokamayarou) 2020年2月7日
KADAI INFO(@kadai_info)は鹿大のサークルで、エンジニア部ではiPhoneとAndroidのアプリを開発している。青春っていいねえ。
#さくらじまハウス2020— すぎ (@ysl0618kgsm) 2020年2月7日
まとめ
【第1弾】Android版「KADAI INFO」【リリースノート】
どうも、KADAI INFOエンジニアの中原です。
今回は、全人類が待ちに待ちわびた神アプリ「KADAI INFO」のAndroid版公開についてお話するぜ!
KADAI INFOアプリとは?
一言でいうと、鹿児島大学生向けの便利な機能をつめこんだ超絶神アプリです。
鹿児島大学生向けなのに、どうして全人類が待ちわびたかって?思い込みは大事だぜ!
ちなみにアプリはこちら
本題に戻ろう。
鹿児島大学生向けの便利な機能ってのを現在実装されているもので説明していくぜ!
記事閲覧
KADAI INFOが掲載している記事をカテゴリごとに簡単にアクセスできるぜ!
カテゴリは具体的に言うと、「グルメ」「就職」「エンタメ」「やってみた」...などたくさんある!
左の画像みたいに、カテゴリ一覧とそのカテゴリ内の記事が表示され、読みたい記事をタップすると右の画像のように、記事ページにアクセスできるぜ!
この時点で使いやすさが神っちゃいました!
時間割
今後実装予定~
このブログについて
はじめまして、KADAI INFOエンジニア長の藤澤(@fujisawa_kadai)です。
ついにKADAI INFOでもテックブログを書くことになりました!
KADAIINFOとは何ぞや?という人はこちらをチェックしてください!
基本的にはジャンル、技術レベルを問わず記事をアップしていく方針です。
よろしくお願いします。