生活 - 学習の記事一覧
Flexbox Defense - タワーディフェンスゲームを通じてFlexboxの使い方を学ぶ
ゲームを通じて技術を学ぶのは興味深い手法です。体験する人も楽しみながらプログラミングが学べます。書籍やオンライン情報を元に自分だけで学んでいくのは困難ですが、ゲームで対話を楽しみながらできれば継続できそうです。今回紹介するFlexbox DefenseはCSS3のFlexboxをタワーディフェンスゲームをベースに学ぶソ...
The Fabricius Project - AI/機械学習を使ってヒエログリフを学ぼう
古代のエジプトではヒエログリフと呼ばれる象形文字が使われていました。博物館などで、エジプト関連の遺跡を見たり、映画で考古学系のものを見ると目にすることの多いものです。あのヒエログリフ、書かれていることが分かったらちょっと知識人っぽいですよね。そんな夢を叶えてくれるのがThe Fabricius Projectです。AI...
HTML DOM - 素のJavaScriptでどうDOMを操作するのか学ぼう
jQueryやVue、Reactなどを触っていると、実際のDOM操作をどう行うのか忘れてしまったりします。DOMを作ったり、追加する、変更するといった操作は意外と面倒ですが、直接行う分、高速であるはずです。HTML DOMはそんなDOM操作を素のJavaScriptで行う方法を学べるWebサイトになります。## HTM...
Storybook - フロントエンド開発者向けUIコンポーネント学習サイト
フロントエンドで利用できる技術が多様化しており、それらの使い方を効率的に学ぶ手段が欲しくなっているはずです。大事なのはその場で実行したりして確認できることで、それによって敷居が大幅に下がるはずです。今回紹介するStorybookは各種フロントエンドフレームワークに対応した、UIコンポーネントエクスプローラーです。## ...
Type Puzzles - TypeScriptの基礎、型について学ぶ
TypeScriptをこれから学習したいと考えていますか。TypeScriptはJavaScriptのスーパーセットなので、基本的にJavaScriptでできることはすべてできます。そして追加される中で最も便利で知っておかないといけないのが型の使い方です。今回紹介するType PuzzlesはTypeScriptの型を...
JsBattle - 対戦ゲームを通じてプログラミングを学ぶ
プログラミングを覚えるのにゲーミフィケーションを取り入れるのはいいアイディアです。ただひたすらに写経しながら覚えるのは忍耐力が必要ですし、目的があった方がモチベーションが維持しやすいでしょう。今回紹介するJsBattleはJavaScriptをゲームを通して学べるソフトウェアです。## JsBattleの使い方トップペ...
Unwrap - iPhone上でSwiftを学ぶ
新しいプログラミング言語を学ぶ場合、どのように行っているでしょうか。オンライン情報だけでできる人もいれば、書籍を買うという人もいるでしょう。いずれにしても写経しながら覚えるかと思います。今回紹介するUnwrapはそのどちらでもない第三の選択肢として、iPhone上で学べるSwift学習アプリとなっています。## Unw...
Science Journal for iOS - センサーを活用した実験管理アプリ
スマートフォンはセンサーの固まりです。カメラはもちろん、気圧や照度など様々なセンサーが搭載されています。そうした情報はスマートフォンを便利にするのはもちろん、様々なフィールドワークでも活躍することでしょう。Googleが提供しているScience Journal for iOSはまさにそんな実験を行うためのアプリです。...
Git Explorer - Gitコマンドの使い方をウィザードで学ぶ
Gitコマンドをターミナル上で使っている人は多いはずです。addやcommit、mergeなどであれば問題ありませんが、普段使わない操作を行おうと思った時にコマンドが分からずにWeb検索している人も多いでしょう。それだけGitは機能が豊富で、パラメータの順番まで決まっているので覚えるのが大変です。そこで使ってみたいのが...
HiraganaStream - 平仮名を学習
言葉を覚える方法は幾つかありますが、まずは使われている文字を覚えるのが基本でしょう。英語であればアルファベットだけですが、日本では平仮名と片仮名、さらに漢字を覚えなければなりません。今回紹介するHiraganaStreamは日本語の中でも平仮名を覚えるために作られたソフトウェアになります。## HiraganaStre...
Trigonoparty - 三角関数を可視化
三角関数は高校生くらいで習い始めます。sin/cos/tanなどの関数は懐かしいものでしょう。単純に関数だけを言われても覚えるのは難しいですが、図形を使いながら説明されると腑に落ち、覚えられるかと思います。そこで使ってみたいのがTrigonopartyです。三角関数の基礎について、図形を用いながら可視化します。## T...
DMOJ - Python製のオンラインコンテストシステム
開発者の中には課題解決が好きな人たちがいます。問題を与えられると、嬉々としてその解決に取り組んでしまう人たちです。それが開発者としてのステップアップにもつながりますし、自分の技量を知る術にもなります。そんな方々に使ってみて欲しいのがDMOJです。オンラインで課題解決や、コンテストが行えるプラットフォームです。## DM...
kanjivg-radical - 漢字の構成要素を学ぶ
漢字はそれ単体で意味をなすものよりも、部首や造りなど、小さな部品が集まって漢字を構成しています。それ故、その構成を学ぶことで漢字の意味であったり、形などを理解しやすくなります。そんな漢字の造りなどを学べるのがkanjivg-radicalです。## kanjivg-radicalの使い方kanjivg-radicalの...
Rabbit Ear - 折り紙をWeb上で表現
折り紙は日本が世界に誇れる文化です。海外によく見られるペーパークラフトとは異なり、一枚の紙を切らずに折りきるところに折り紙の良さがあります。できあがった形だけを見ると、どう折ったらこうなるのかと疑問に思うことさえあるでしょう。そんな折り紙をWeb上で表現するのがRabbit Earです。## Rabbit Earの使い...
Popcode - 学生向けのWeb開発/実行環境
プログラミングが教育に取り入れられる中で大事なのは体験です。かつての自主的にプログラミングを学ぶ人たちと違って、欲求を呼び起こすところからはじめる必要があります。そのためにはいち早く結果を見られる形にしなければなりません。そうした中でWebは良いプレゼン層になるでしょう。学生向けに作られたPopcodeをぜひ体験してみ...
tikzcd-editor - Web上で可換図式を描く
Webの表現力はCanvasやSVGによって大きく広がっています。しかし、それらを使いこなすにはプログラミングを駆使する必要があります。例えば、ちょっとした数式を埋め込むダメにプログラミングを行うのは面倒です。そこで使ってみたいのが外部ライブラリです。今回は可換図式をWebベースで実現するtikzcd-editorを紹...
JSRobot - JavaScriptでロボットを操作
最近は子供向けのプログラミング学習が人気です。Sketchのようなビジュアルプログラミング言語が人気ですが、自由にプログラミングをはじめようと思うと物足りなく感じるでしょう。そこで次の段階としてJSRobotを紹介します。ロボット操作を通じてJavaScriptを学べます。## JSRobotの使い方開始します。!
duo-desktop - Electron製の英語学習ソフトウェア
英語を学習したいと思っている方はたくさんいます。そのためのサービスも多数ありますし、ソフトウェアで学習することもできます。しかし、より自分にマッチしたものを求めるならば、自作してしまうのも面白そうです。今回紹介するのはduo-desktop、Electron製の英語学習ソフトウェアです。## duo-desktopの使...
Grid Garden - CSS Grid Layout Moduleについて学べる学習ソフトウェア
CSSの使い方をちゃんと覚えるというのは大変です。しかも日々進化しており、新しいプロパティが追加されたりします。もちろんすぐに汎用的に使える訳ではありませんが、先進的なブラウザからどんどん導入が進んでいきます。放置しておくとあっという間に時代に取り残されてしまうでしょう。今回紹介するGrid GardenはCSS Gr...
Robotopia - ロボットを操作しながらプログラミングを学習
小中学生に向けにプログラミングを学習できるコンテンツやサービスが増えています。一昔前であればBASICやCを使っていきなりコーディングをしていたと思いますが、今時であればビジュアルプログラミングからはじめるのが基本でしょう。今回紹介するRobotopiaもそんなビジュアルプログラミング言語の一つです。お題に沿って進める...