Atom上でドットインストールを再生!「Dotinstall Pane」で最適化

ドットインストールは、動画で学ぶプログラミング学習サイトです。

プログラミング初心者を対象にしていることから、これからプログラミングを始める方にものすごく人気のあるサイトですね。

素晴らしい学習サイトですが、扱いづらいと思う点も少しだけあります。

・公式Webサイトの動画にはショートカットキーがほとんど無く、再生位置などはすべて手動

動画なので作業が遅れてしまったとき、マウスを使って再生位置の調整するのは、とにかく面倒でした。

動画はわかりやすい反面、タイミングを合わせづらいというデメリットも存在します。

スペースキーで再生/停止はできるものの、Atomでプログラミングをしながらだとほとんど使うことはありませんでした。

しかし、Atomには拡張機能として様々なプラグインをインストールすることができます。

「Dotinstall Pane」はドットインストール公式の拡張プラグインで、Atom上でドットインストールの動画を視聴することが可能になります。

Dotinstall Paneを活用すれば、ドットインストールの学習速度が一気に加速するので、ぜひ導入したいところ。

※Atomはプログラミング特化のテキストエディターです

Atom公式Webサイト

Dotinstall Paneのインストール方法

1.Atomの「File」-「Settings」を選択します。

2.「Install Packages」から「datinstall-pane」を検索します。「datinstall-pane」が表示されれば、「Install」をクリックしてください。

3.ここでAtomを閉じてください。(再起動)

4.再びAtomを立ち上げてキーボードの「Alt」-「Shift」-「d」を押すと、ドットインストールが表示されます。

左半分に動画が現れます。

ショートカットキー

ドットインストールの表示/非表示:「Alt」-「Shift」-「d」
動画の再生/停止:「Alt」-「Shift」-「Enter」
動画を5秒戻す:「Alt」-「Shift」-「 [ 」
動画を5秒送る:「Alt」-「Shift」-「 ] 」

このショートカットキーを覚えると、Atomの操作のほとんどをキーボードだけで行うことが可能になるので、かなり便利になりました。

atom-html-previewでさらに便利に

このプラグインを使用すれば、本来はブラウザでhtmlの見栄えの確認をするところ、

Atom上でhtmlの見栄えを確認することができるようになります。

ブラウザでの検証機能は使えなくなるので、要所々々で使い分けることをおすすめします。

1.Atomの「File」-「Settings」を選択します。

2.「Install Packages」から「atom-html-preview」を検索します。「atom-html-preview」が表示されれば、「Install」をクリックしてください。

3.ここでAtomを閉じてください。(再起動)

4.再びAtomを立ち上げてキーボードの「Ctrl」-「Shift」-「H」を押すと、htmlの見栄えが表示されます。もう一度押すと非表示。

右側に表示されます。

最後に

これらのプラグインを使えば、効率よくドットインストールの学習を行うことができそうです。

これからドットインストールを始める方はぜひチェックしてみてくださいね。

Atom公式Webサイト

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でtwo_audioをフォローしよう!