プロラボ2020春のハッカソンの成果報告

始めに

プロラボ2020春のハッカソン、デプロイ部門敗退しました笑笑

悲しいことに、デプロイ先の環境で動きませんでした(泣)。適度にテスト環境にデプロイしながらの開発って大事ですね。痛感しました。

仕方なく動画を撮ったので、ご覧ください。 drive.google.com

ちなみにトップページに、「このサイトは予告なく公開を停止する可能性があります。いやきっとします。」のような記述をしてしまいましたが、そもそも公開できてなくて草が生えまくりですね。

作ったもの

今回のテーマは「暇」でしたね。暇であるということは、時間があるということです。時間があるときにできることの一つに「研究」があります。研究対象は何でもいいと思うのですが、ご存知の通り私はきららが好きです。なので今回私はまんがタイムきららで連載された作品の掲載順の推移を調べることが面白いんじゃないか?と思いました。そこで、「『まんがタイムきらら』に連載された作品の掲載順を、グラフ化して表示する」アプリを作りました。

掲載順の推移を調べる理由

そうは言ってもほとんどの人が、これを調べることの面白さがわからないと思うので説明したいと思います。

興味がない人向けに一言で説明すると、掲載順を調べることでその作品の人気やその作品の今後(アニメ化できそうかや、何巻で終わりそうか、など)を把握できるからです。

詳しく説明すると、まんがタイムきららは毎月発行されている月刊紙なのですが、各作品が掲載されている順番は毎回ランダムで決まっているわけではありません。順番を決定する要素の一つは、毎月月刊紙についてくる読者アンケートの結果です。自分のようなきらら好きは、毎月これをびっしりと埋めて編集部に送っています。これの結果が良い作品ほど前に掲載されていると言われています。ただし、順番を決定する要素のもう一つに「編集部の考え」というものがあります。例えば、連載中の作品が初めて単行本を出す月の掲載では、前の方に掲載される作品が多いです。逆に、単行本の売り上げが伸びなかった作品だと、単行本発売前と比べて目に見えて後ろに配置されたりします。

そのため、作品の人気が同じくらいの作品は同じような推移をすることが多いことが、多くの人が経験的に知っています。例えば人気作品である「ご注文はうさぎですか?」や「こみっくがーるず」は、連載初期から高い順位を取り続けていました。もう分かったと思いますが、これらのパターンを調べることで、今掲載中の新しい作品の人気や、どのような展望を見せるのかを調べれるかもしれないということです。

数学的手法を使って調べた方がよくね?と思う人も多いと思いますが、感覚的に楽しめても良いよねって思いで作っています。(もちろん数学的な手法を用いて調べたいという思いもあります。)

参加した感想

グラフ描画系のライブラリって扱うのが難しいですね。今回 Victory というライブラリを使ったのですが、最初の計画では4日ほどで進捗ある程度出せるやろ、と思っていました。しかし、自分が実現したい機能の実現の仕方が全然わからなくて、昨日までマジでほとんど動いてなかったです。仲間かと思ってたらすぐに裏切った弊部部長を呪ってやろうかと思いました(冗談です)。棄権かな〜とか思っていたのですが、何とか二日で動くものにこぎつけられてよかったです。

COMIC FUZでビューアーからメニューへ戻る

「COMIC FUZ」でまんがを読んでる途中でメニューへ戻る方法がわからず戸惑ったので書き残します。

方法

ビューアーの中央部をワンタッチ

COMIC FUZ のビューアの画像、中央を赤で表示
すると、以下のような画面になるので左上のバツボタンを押す。
COMIC FUZのビューアの画像、左上のバツボタンを赤く強調
自分と同じように、戻りかたがわからず困っていた人の役に立てれば幸いです。

首が痛い

 この記事はNITKC"Fav"lab Advent Calendar 2019の13日目の記事として書かれています。

adventar.org

 腰が痛い人、歯茎が痛い人、首が痛い人...、58代のプロラボ部はどこかしら痛めてますね(笑)。

 この記事はタイトル通り、首を痛めてしまった筆者のお話です。三度の飯よりプログラミングが好きであろうプロラボ部の皆さまにとって、首を痛めることは本当に辛いことです。なので私の記事を読んで、首を痛めないように気をつけてもらいたいと思います。


出会い

 私が首を痛めたのは約1年前、学年末テストで必死に勉強してた時です。私はもともと首をかなり曲げて文字を書く癖があり、テスト前なのでその姿勢を何度も長時間続けたため、結果痛めてしまいました。

f:id:annin401:20191224231231p:plain:w250
勉強の後、首が痛いと感じてる人、首の曲げすぎかも...

 勉強やプログラミングを変な姿勢でして、1〜2日痛めてしまうことは多くの人が経験があると思います。しかし、本格的に痛めてしまうと短時間で治ることはありません。どれくらいかかるかというと、痛めてから九ヶ月以上たった今でも違和感を感じるので、治すのに1年は少なくてもかかります。


発生する問題

集中できなくなる

 まず、朝起きた時から首に痛みを感じます。立っていても、座っても常に首が痛いです。春休みの頃が特にひどく、痛すぎて数時間に一回寝っ転がって休んでいました。そのため、とてもプログラミングに集中できるような状態ではなくなりました。

 今でこそ、だいぶ痛みが治りましたが、違和感は以前あり、テスト勉強のやる気やプログラミングの集中力を奪われ続けています。


違和感を取るために首をかしげる癖がつく

 首が痛い時に、痛みがなんとく取れそうなので首を思いっきり曲げたことは無いでしょうか?私はこれが完全に癖になってしまいました。無意識にやってしまうので恥ずかしいです。


首の痛みを解消するためにいろいろお金を使う羽目になる

 最初の一ヶ月は様子を見ていましたが、結局整体に行きました。そこで受診料4000円を取られた上、約2万円の枕も買うことになってしまいました。

f:id:annin401:20191224234446j:plain:w250
すややか D.C.Version2

  他にも、ノートパソコン単体で作業すると猫背になり首がキツすぎるので、ノートPCスタンドを買ったり、外付けキーボードを買ったり、椅子を買い直したりして合計7万円くらい首の痛みのために使いました。キーボードとかは、首が痛くなくても買ったかもしれませんが、この出費はかなりきついです。


こうならないために

 このように、首を痛めると本当にやばいです。何よりプログラミングに集中できなくなるのが本当に辛いです。こうならないためにすべきことは、

首が痛いと感じる姿勢で勉強やプログラミングをしない

これに尽きると思います。まず机と椅子には適切な高さが存在します。なるだけこれに近づけましょう。 www.fujitsu.com

 後、ノートPCは構造的に長時間の作業に向いてないので、家では外付けマウスやキーボード、ディスプレイを使用する、それができなくても、PCスタンドを使うだけでもだいぶ違うと思います。

 作業した後にどこか痛みが感じるということは姿勢が何かしら良く無いということです。この記事を読んだ皆様が僕みたいにならないことを願っています。

 読んでいただきありがとうございました。

web開発初心者がReactに手を出すのは正しかったか

 この記事は久留米高専プログラミングラボ部AdventCalendarの23日目として書かれています.

adventar.org


自己紹介

 こんにちは,2年生のanninです。私は今年,チャレキャラというアプリ開発初心者対象のコンテストに4人チームで参加しました。そこでReactとFirebaseを用いてチャットアプリを開発しました。この記事では、タイトル通りチャレキャラに参加するまでほとんどweb開発に触れていなかった私が、半年Reactを使ってみて感じたことを書きたいと思います。  なお、筆者はまだまだ未熟のため技術的に曖昧な記述をしているところもあるかもしれません。その時は優しくまさかりを投げてくださると助かります。


Reactとは

 そもそもReactを知らない人に向けて簡単に説明すると,動的なwebサイトやwebアプリ(例えばSlackやDiscord)のフロント部分(実際にユーザーが触る部分)を作ることができるJavaScriptフレームワークです.よくわからないと思った人は,ChromeFirefoxなどのwebブラウザで動くアプリを作れるやつと理解していいと思います.

f:id:annin401:20191223232751p:plain:w400

 ちなみに、このReactで実装できるようなwebでユーザーが直接操作する部分をフロントエンドと呼ばれます。このフロント技術に関してですが、私がReactを学ぶ前にフロントエンドロードマップというものを見つけました。

 見てもらうとわかるのですが、Reactを含むフレームワークがロードマップに出てくるのはかなり後です。これを最初見た時は、JavaScriptを一切触ったことなく、HTML/CSS もまともに書けない自分がReactでアプリを作れるのだろうかと、とても不安になりました。

では、このような自分がReactに手を出したのは正解だったのでしょうか?結論から言うと、私は正解だったと思います。それは以下の理由からです。


理由

派手なことが比較的簡単にできる

 私はチャレキャラに参加する以前、二ヶ月くらいかけてpythonPyQtと呼ばれるフレームワークを用いて画像ビューアを開発しました。その時に、まず画像を表示させる方法が分からず悩み、縦横比を調べて拡大の仕方を変える処理も標準では用意されていなかったので書き、挙げ句の果てにはウィンドウの移動の処理も書かされました。

f:id:annin401:20191224004257p:plain:w200
 PyQtが酷すぎるだけの気もしますが、世の中にある「GUIを作れます!」と言っているライブラリやフレームワークって「作れはするけど作りやすいっては言ってない!」って感じのやつが多い気がします。こういうライブラリは使った時間や努力の割に作れるものが地味だったり、得られるものが少ないため、文化部発表会の展示で、努力が伝わらず結果展示を見にきたエンジニアに「この程度かww」って感じのえみを浮かべながら話されたという筆者のような悲しい事態が起きたりします。  その点Reactはそのようなライブラリやフレームワークに比べれば非常に書きやすく、簡単にGUIを書くことができます。情報も多いので、分からないことがあっても解決策を見つけれることが多いですし、何より簡単に派手なことができるので、モチベが維持しやすいです。
f:id:annin401:20191224004533j:plain:w200
チャレキャラで作ったアプリ「Lask」

HTMLやCSSを学ぼうと思うきっかけにもなる

 私は実はチャレキャラに参加する前にも、ちょっとだけHTMLとCSSを学んだことがありました。しかしこれらはかなりデザインよりであることや、情報を調べた時にコーダーと呼ばれる職種の記事が多く、「自分がしたいことはこんなことではないのでは?」と思ってしまい長続きしませんでした。
 ではReactを使うとどうなったでしょう。実はReactをただ使うだけなら、HTML/CSSの知識は最低限あればなんとかなります。webサイトのコードをディベロッパーツールで見ても全然分からない自分でもなんとかなりました。むしろReactはコンポーネント指向の考え方が分かっているほうがすんなり入ってきます。デザインに関してもCSSフレームワークを使うことによって、CSSをかけなくてもなんとかなります。が、しかし自分は使ってる途中で、細かいところをいじり方が分からないことにむずむずするようになりました。何をいじれば望み通りの見た目になるか分からないのです。結果HTML/CSSをやっぱりもっと学ぼうと思えるきっかけになりました。


終わりに

もちろんHTML/CSSにすら一切触れたことがないだけでなく、そもそもプログラミング自体が初心者の人がReactに手を出すのはきついと思います。が、しかしプログラミングの基礎はあるけどやりたいことが見つけられない人や、webやってみたいけどHTML/CSSに興味を持てなかったという人はReactをやってみる価値は全然あると思います。やってみないと分からないことは人生多いので、もし今やりたいことを見つけれてない人は、Reactをやってみるのは良いと思います。

チャレキャラに参加しよう

 チャレキャラと呼ばれるアプリコンテストに4人チームで参加しました。このイベントは、学生の育成を重点に置いている大会であり、そのため開催期間が約半年ととても長いのが特徴です。この特徴から、プログラミングで今は自信がないけど強くなりたいという人や、本格的なアプリ開発をやってみたいと思ってる人には最高の大会です。

challecara.org

 この記事では、チャレキャラに参加して良かったと思うところをまとめたいと思います。

 

良いところ

きちんとしたアプリを作るきっかけとなる

 独学でプログラミング勉強して、単純なタイマーのような小規模なアプリなら何個か作ったことがあることも多いかもしれません。しかし、アプリストアにあるようなちゃんとしたアプリを作るには、知らないといけない知識や技術はとても多いです。そのため勉強の段階で諦めてしまう人が多かったり、また技術を学ぼうと思っても何が作れるのか想像がつかず学ぶモチベが出ない人も多いと思います。

 しかしチャレキャラでは、参加したら最初のイベントで作るアプリすぐに決めます。次にそのアプリを作るために学ぶべき技術を現役のエンジニアから教えてもらうことができます。具体的に作るアプリを決めてから学ぶので、モチベを維持して技術を学ぶことができ、学び方を聞いたりエラーが出たらチャレキャラのslackチャンネルできくこともできます。また、コンテストなので締め切りがあります。締め切りに追われながら開発ができるので、その点でもモチベを維持しやすいです。

 私は今回のコンテストでReactとFirebaseでチャットアプリ開発しましたが、このチャレキャラに挑戦する前まではwebのフロントエンド技術にほとんど興味がありませんでした。しかしReactを学んでみたら、「簡単に派手なことができる。面白い!!」となり、とてもフロントエンド技術に興味を持てました。このように、今まで触ったことなかった技術に触れることができるようになるかもしれないのもチャレキャラの魅力です。

初心者歓迎

 アプリコンテストは他にもたくさんあります。しかしそのほとんどは、アプリ一本当たり前のように仕上げられる人が参加するのを前提にしています。とても初心者が参加できる場所ではありません。

 しかしチャレキャラはアプリ開発未経験者が参加することをとても歓迎しています。そのため気軽に応募でき、上記のようなサポートを受けられるので、とても初心者に優しいです。つまりチャレキャラは、初心者にアプリ開発のスタートを切るきっかけ、チャンスを与えてくれるのです。

強い人に会える

 家で一人でプログラミングしていても、なかなか強い人会う機会はありません(ごりごりにTwiiterを活用している人は別ですが)。しかしチャレキャラに出ると、同じ年齢でバリバリ書ける人やプログラミングで生きているプロのエンジニアと出会うことができます。そのためとても刺激になります。

 また、コミュニケーション力があればプログラミング仲間やエンジニアと知り合いになれます。私はコミュニケーション力が低いので増やせませんでしたが、知り合いは絶対増やしたほうがいいです。自分のコミュ力もっとあげたい...。

 

まとめ

 以上のことからチャレキャラ非常に良いコンテストです。もし参加に迷っているなら絶対出たほうがいいです。半年は確かに長いですが、得るものも大きいです。この記事を読んで、チャレキャラに参加しようと思った人が少しでもふえたらいいなと思います。

<bits/stdc++.h>をmacOS Catalinaで使う

macOS Mojaveの時は上手くいってたのですが、アップグレードしたら使えなくなりました。なので、また使えるようになるまでにやったことを書き残したいとおもいます。

 

brewgccを入れ直す

以前の記事でも書きましたが、macはデフォルトの状態でもgccが入っていますが、古いです。なのでbrewを使って新しいgccを入れます。自分はMojaveの時ににインストールしていましたが、一度アンインストールして入れ直しました。

brew uninstall gcc

brew install gcc

 

パスを通す

ここでwhichコマンドを使ってどこにあるg++(gcc)が動いているかを調べます。

which g++

これを実行して、「/usr/local/bin/g++」と表示されなかった場合、brewでインストールしたものではなく、古いgccが動いてる可能性が高いです。なので、入れたgccが動くようにパスを通します。

ln -s /usr/local/Cellar/gcc/9.2.0_1/bin/g++-9 /usr/local/bin/g++

n -s /usr/local/Cellar/gcc/9.2.0_1/bin/gcc-9 /usr/local/bin/gcc

これでg++が動かなかった場合、すでに作っているシンボリックリンクが邪魔している場合があります。なので ls -l /usr/local/bin/g++と入力して、上のパス以外のものが出てきたら、rmしてください。

 

xcode-select --install

これは、std/c++.h を使えるようにするのに直接的に関わるのかはわかりません。というのも、自分は上の工程を行う前にこれを行なったからです。上の工程だけでは動くようにならなかった人は、これもやってみてください。

xcode-select --install

 

あとがき

当たり前のように、パスを通すとかシンボリックリンクを削除とか言いましたが、コマンドラインについて詳しくない人には、よくわからなかったかもしれません。このあたりの知識があまりない人は、「mac ターミナル 入門」などと調べて学んでみると良いと思います。面白いですし、PCを使っているなら学んで損はないと思います。書籍で学ぶ場合は、これから学ぶmacOSターミナルという本がおすすめです。私はこの本で学びました。ちょっと高いですが、丁寧な解説でわかりやすかったです。なおこの本、初心者がちんぷんかんぷんな前書きから始まるので、前書きを飛ばして読むのがオススメです。

以上です。

ゆるく知るきらら

この記事はNITKC"Fav"lab Advent Calendar 2019の13日目の記事として書かれています。 adventar.org


はじめに

こんにちは。2Sのanninです。ラボ部員であまり私と面識が無い方は、1年生歓迎会で「圧倒的尊いっ!!」と言いながらスライドをパンパン叩いていた人、と言えばわかるでしょうか(これ初めて聞いた人にとってはやばい奴ですね)。

ところでこの記事をお読みのそこのあなた、「きらら」をご存知ですが?「日常系作品とかで呼ばれるあれ?」とか思った方、正解です!

私はこの「きらら」が大好きです。皆さんのご察しの通り、この記事はきららを紹介するものとなっております。この記事を読んで、きららについてなんとなくでもいいので知ってもらえると筆者は非常に嬉しいです。


きららとは

まずはきららが何なのかについてからはじめたいと思います。きららは芳文社刊行している四コマ漫画誌、『まんがタイムきらら』及びその姉妹誌の略称です。週刊少年ジャンプが「ジャンプ」と呼ばれているのと同じです。

f:id:annin401:20191214105552j:plain:w200
この雑誌は日常系作品を多く連載しています。「心ぴょんぴょん!」という言葉を広めた『ご注文はうさぎですか?』や、「今日も一日がんばるぞい!」の『NEW GAME!』、シャミ子と桃のカップリングで最近よくtwitterで見かける『まちカドまぞく』など作品が有名ですね。
f:id:annin401:20191214103549j:plain:w250
NEW GAME! 1巻

まんがタイムきららの創刊は2002年と長い歴史を持つわけではありません。しかし、日常系というジャンルが確立しておらず、萌え四コマ黎明期の当時に萌え四コマ専門誌として創刊し、日常系というジャンルの確立に貢献しました。そして今ではそのジャンルにおいて大きな存在となっています。


きららの特徴

この雑誌は15年以上刊行しているだけあって、「きらららしさ」と呼ばれる連載作品に共通する特徴やコンセプトが存在します。しっかりした定義はなく、あくまで個人の考えですが、以下のようなことが挙げられます。

1. かわいいが第一!

この雑誌に出てくる女の子はどの子もかわいいです。これは説明するより見てもらったほうが早いですね。

f:id:annin401:20191214114009j:plain:w250
ご注文はうさぎですか?
f:id:annin401:20191214114756j:plain:w250
こみっくがーるず
かわいいは正義ですね。(ちなみにこの言葉は新部長の口癖だったりします。)この雑誌は萌え四コマ専門誌でスタートしたこともあり、かわいいことが連載の絶対条件であるように感じます。ふとした仕草や表情、言葉などにも可愛く、読んでいて非常に幸せな気持ちになれます。

2. 女の子がいっぱい

登場キャラクターのほぼ全員が女の子の作品が多いです。男が一切出てこない作品も珍しくありません。(時々、ヒロインの両親の登場シーンでお父さんだけ顔が黒くなってる場合があり、可哀そうだなって思うこともあります。)

f:id:annin401:20191214115345j:plain:w250
会話シーンがあるにも関わらず、素顔が一切出てこない、『こみっくがーるず』のかおすちゃんのお父さん
ただし、全員が女の子 == 百合作品 かと考える人もいるかもしれませんがそれは違います。女の子いっぱいでも百合ではなく、キャラクター達が過ごす楽しくてかわいい「日常」を描いている作品が多いです。もちろん百合作品もありますが、きらら == 百合 ではないことを覚えて帰って欲しいです。

3. クスッと笑えて面白い

きららをあまり知らなかった人は、面白いの?と思うかもしれません。まんがタイムきらら四コマ漫画であるため、四コマ目でオチを付けながら進む作品が多いです。もちろん、声に出して大笑いする感じではなく、クスッと笑えるタイプの面白さですね。かわいくて面白いって最高じゃないですか!?

f:id:annin401:20191214115156j:plain:w250
今最も熱い作品、「ぼっち・ざ・ろっく」

4. 輝きがある!

芳文社は、きららのコンセプトとして「希望や夢、勇気、ときめきなど"きらきらとした輝かしいもの"を読者に届ける」ということを掲げています。そのため、連載作品にも「夢に向かって頑張る」作品や「仲間と共に部活や仕事を頑張る」、「学校以外に輝ける場所を見つけた」など様々な"輝き"を取り上げる作品が存在します。このような作品から生きるエネルギーをもらうことができます。

f:id:annin401:20191214115750j:plain:w200
きんいろモザイク

きららの魅力

きららの魅力はやはり、「かわいい」です。しかし、私はきららの真髄は「かわいい × クスッとした笑い」の調和性の高さだと思っています。これは自論ですが、クスッとした笑いは「かわいい」と非常に調和します。

きららは何度も言うように四コマです。四コマは毎回四コマ目にオチをつけるという特徴から、テンポが生まれます。そのテンポはまるでBGMのように作品に流れ、かわいいを引き立たせ、作品をより魅力的にするということを、きららの作品を読んで学びました。このことは、萌え四コマやきららが持つ強みであり、きららの隠れた魅力であると思います。


まとめ

どうだったでしょうか。少しでもきららについて知ってもらえたでしょうか?きららはかわいいが好きな人には最高のコンテンツです。もし興味を持ってもらえたなら、COMIC FUZ で気になった作品を読んでみてください。FUZは芳文社公式のマンガアプリで、無料で多くの作品を読むことができます。気軽に読み始めることができるので、入門に打ってつけです。

cp.comic-fuz.com

また、気に入った作品があったら紙版を購入することをオススメします。きららの原作は通常の漫画よりも綺麗な紙が使われているため美しく、本棚に置くことで満足感も得られます。また、定期的に読み直す気にもなりやすいのも紙だと思います。

最後になりますが、きららは本当に良いので少しでも興味があったら是非読んでみてください。読んでくださりありがとうございました。