javascriptでローカルで動くツールを作りたいです。
その際、ツールを作るための環境構築として何が必要なのかが知りたいです。
作りたいツールは、エディタや作業効率を上げるものです。
visual studioはインストール済みです。
それと、Electronというのが必要なようです。
ですが、これはWEBアプリを作るものとどこかで読みました。
正直、visual studioとElectronの関係性なども、よく分かってないです。
みなさんが、ローカルで動くツールを作るとなった場合、
どんなものをインストールして、環境構築をするでしょうか?
よろしくお願いいたします。
追記
みなさま、たくさんの回答ありがとうございます!
感謝です!
プログラミングを覚えようと思ったキッカケが、
ローカルで動かせるツールを作りたい!と思ったためです。
ローカルで動くツールを作るのに、
始めは、何でもできるらしい・・・とRubyを勉強し始めました。
しかし、質問すると、
どうやらローカルでのツール向きではないとのこと。
ローカルでのツールは、javascriptがいいと聞き、
javascriptを勉強して、どうやってツールを作れるのだろう?→ココの質問
でも、javascriptもローカルで動くツールを作るのに難しいみたいです。
すでに、Rubyとpython、javascriptの書籍(kindle)を購入したりして、
ちょっと情報に振り回されている感じです。
ローカルで動くツールを作るなら、
visual studioとC#というのがいいのでしょうか?
気になる質問をクリップする
クリップした質問は、後からいつでもMYページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。

回答7件
0
javascriptでローカルで動くツールを作りたいです。
作りたいツールは、エディタや作業効率を上げるものです。
フフ......へただなあ、カイジくん。
へたっぴさ........!欲望の解放のさせ方がへた....。
カイジくんが本当に欲しいのは...CLI(こっち)......ターミナルを立ち上げて....コマンドをぱぱっと入力してさ......自動的に仕事をこなして欲しい......!だろ....?
解説していきましょう。
JavaScriptでローカルで動くツールを作りたいの根幹は作業効率を上げる目的です。
JavaScript(以下JS)は主にWebサイトのフロント側で動作するスクリプトですので、
ジャンルとしてはGUI(グラフィック ユーザー インタフェース)のジャンルになります。
しかしGUIは画面の作り込みに途方もない時間がかかります。
普段何気なく行っているマウスクリックも座標により意味合いが変わりますので、動作を全てコード化する必要があります。
エンジニアの上級者で1クリック10行程度、質問者さんのようなプログラミング初心者なら30行程度を面倒見る必要があるでしょう。
あなたのような発想をする人間をたくさん見てきましたが、この辺でだいたい9〜10割が挫折します。
従って文字列→文字列の変換はCLI(コマンドライン インターフェース)の方が圧倒的に適しています。
ターミナルの黒い画面で謎のコマンドを打ち込んでるあれですが、タイプ速度や知識次第で、単純作業は何でも高速にこなせます。
挫折した9〜10割のうち、こちらの方向で力を付けて戻ってきた人間が1割といったところでしょうか、私はこのタイプの人間になります。
ですので作業効率を上げたければCLIで問題を解決しまくる漫画、シス管系女子をまずは読みましょう。
現職エンジニアが描いた(書いた?)可愛らしい絵柄を切り口に漫画で分かりやすく、現職エンジニアでも知らなかった…便利…な事を数多く紹介している漫画です。
脱線ここまで
javascriptでローカルで動くツールを作りたいです。
この辺は根本から勉強しないと分からないでしょうね…わかりました。
そもそもJSとはなんぞやから解説していきましょう。
JSはChrome等のブラウザでWebサイトを閲覧した時に、
裏でHTML要素(DOMツリー)を書き換えて、アニメーションさせる為のスクリプト言語です。
その用途はHTMLを書き換えるのに特化しているので、ファイルを読み書きするような機能はなく、
RubyやPython、PHP等の言語と比べて機能面では非常に貧弱です。
でもフロントエンドエンジニアとして数多くのJSコードを書いてきたライアン・ダールさん、
ブラウザ以外でもJSを使いたいとワガママを言い始めますが機能が足りません。
「足りない機能は俺が作ってやらぁ!」と本当にC++で書き始め、最終的に出来たのがNode.jsです。
例えばvar fs = require('fs');
等という風にNode.js用に用意したrequire関数からC++で作ったファイルの読み書きモジュールfsを利用できます。
これは便利だってことで、賛同した様々なエンジニアがやってきて巨大なプロジェクトに成長しました。
なのでブラウザ関係なくJSを動かしたいなら現状はほぼNode.js一択。
まぁ、Node.js自体は前述のCLIの自作ツールを作るのが得意な言語であり、GUIにはカスリもしません。
しかしCLIは作業効率をアップさせるのにめちゃくちゃ有用ですので、CLIの自作ツールを作れるNode.jsも覚えれば質問内容に関してダイレクトに役立ちます。
Electronというのが必要なようです。
GitHub社がJSを使ったエディタを作りたいと言い始めました。
普通にやったら無理です、しかし持ち前のエンジニアリング能力を無駄に駆使し始めてChromeが内部でエンジン部分として利用しているWebKitとNode.jsを組み合わせ、画面をHTMLとCSSを使ってWebページのように作り上げ、JSではなくNode.jsを繋ぎこんで作ったエディタを作りました。
(ChromeはWebKitじゃ満足できないやだやだと言い始めて、別のレンダリングエンジンを作って乗り換えたので過去の話になってますが)
そのエディタがAtom、このノウハウをライブラリ化して配布し始めたのがAtom Shell。
後にElectronと名前を変えました。
参考サイト: Atomで使われている「Atom Shell」が「Electron」に改名し新公式サイトも公開される!
内部はガチガチのNode.jsのプロジェクトであり、
Node.jsを普通に読み書き出来て、最低限作りたいCLIのツールを定義して作って公開出来る程度の腕前がなければ歯が立たないでしょうね。
もちろん画面をHTML+CSSで実装するので、HTMLやCSSで自在に画面を表現出来るスキルも問われます。
もし自分でぐぐってElectronでアプリを作る事が出来ないのならば、
TeratailでElectronの使い方を100回質問しても自分で作れるようにはなりませんので、
まず自分の作業効率を上げる為にシス管系女子を読んだ上で、それでも無理ならNode.jsに手を出してください。
visual studio
Visual Studioはマイクロソフト社が作ったC、C++、C#等のソースコードを読み書きする統合開発環境です。
なのでJS、HTML、CSSを読み書きするにはちょっと目的から離れているように思えますね。
もしかして: VSCode?
visual studioとElectronの関係性なども、よく分かってないです
以上をまとめます。
ElectronはHTML+CSS+JSでデスクトップアプリを作るライブラリ
VSCodeはHTMLやCSS、JSを読み書きする為のツール
【追記部分への対応】
何でもできるらしい・・・とRubyを勉強し始めました
え?Rubyで別になんでもできますよ。
別にPHPでもPythonでもNode.jsでも書き方が違う程度で、なんでもできます。
質問文ではGUIにこだわっており、GUIのデスクトップアプリを作るのであれば確かにRubyは少し違います。
でもほとんどのデスクワークの本質は文字列を受け取り、新しい文字列を生成して、納品することのハズです。
この文字列→文字列を自在に操る感覚を身につければデスクトップアプリは必ずしも必要な存在ではありません。
例えばExcelは斜めに矩形選択して、テキストファイルにコピペすればタブ区切りのTSV文字列として抽出できます。
逆にタグ区切りのTSV文字列をコピーしてExcel上でペーストすれば値が展開されます。
ローカルでのツールは、javascriptがいいと聞き
私はJSが最も得意な言語なので、慣れないRubyやPythonを扱うよりはよっぽど「いい」ですが、
他人にNode.jsを率先して教えようとは思いません。普通にRubyやPythonを勧めます。
同じくWeb畑の人間で、JavaScriptがそれなりに書けるけど、RubyやPythonは苦手という後輩がいれば、ならNode.jsにしてみたら?という感じで勧めますけどね。
ローカルで動くツールを作るなら、
visual studioとC#というのがいいのでしょうか?
GUIをガッツリ扱ってなにかを作るならVisualStudioでC#が一番楽でしょう。
業務で作ってる人も多いですし、Windows用のゲームを作るなら現状最も有力な選択肢ですからね。
投稿2018/08/09 04:14
編集2018/08/09 10:41総合スコア21386
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。

0
#JavaScriptに目をつけたあなたはセンスがいい
あるハッカーは言っていました。ハッカーになりたければまずHTMLを学べと。ただ、この言葉は20年位前のもので、現在は状況が大分変化しております。
#Windowsプログラミングの基本
Windowsは基本的にC#でプログラミングします。しかしC#はVisual Studioという開発環境でプログラミングするので大量のハードディスク容量(>1GB)とRAM容量を消費します。まず、Visual Studioが快適に動作しない環境においてはWindowsプログラミングを断念すべきでしょう。
C#は難しくありません。「猫でもわかる~」シリーズをKindleで購入して学習すればすぐ身に付きます。
ただ、Windowsプログラミングというもの自体、厳しい道であることを覚悟した方がいいでしょう。VectorなどでWindowsのフリーソフトをダウンロードできますが、有名でないソフトはWindowsやウィルス対策ソフト(Norton等)の保護機能によって容赦なく削除されます。つまり、あなたの作ったソフトも容赦なく削除されるということです。
また、C#で簡単に作成できるソフトはWindowsフォームというライブラリを使用したものですが、これは正直ダサいです。ではもっとカッコイイソフトを作りたい場合にはどうすれば?という疑問には2つの選択肢があります。DirectXやOpenGLなどのゲーム用のフレームワークを使用することです。これはそこそこ難しいですが実りもあります。もう一つはWPFやUWPといった、Windowsフォームよりも新しいライブラリを使用することです。これはかなり出来のいいものができますが、プログラミングの主流ではないので実りは少ないです。
Python, Ruby, Perlなどで開発するのはいいことでしょうか。悪いアイディアではありません。しかし、WindowsというプラットフォームであればWindowsの機能を100%使いたいでしょうから、その窮屈さに飽きることだと思います。
#HTML+CSS+JavaScript。これは最高の選択肢です。
冒頭でHTMLを学ぶのがよいと言いました。ブラウザ上でサイトを作成するための言語です。ではHTMLで十分なのでしょうか。いえ、今はHTML, CSS, JavaScriptをセットで学習する必要があります。サイトを作成するのに3つもの言語を勉強しなければならないのはなぜでしょうか。それは、ウェブサイトというものがインターネットの初期に比べて高機能化してきているからです。そして、これら3つの言語はプログラマの8割の人が習得しておくべきものです。なぜかというと現在はWeb開発がプログラミングの主流だからです。
Web開発にはPHPやRubyが必要なのでしょうか。答えは2通りあります。単に文字や画像を表示させたりアニメーションをさせるのであれば不要です。会員制サイトのようなサーバーの仕組みを構築したいのであれば必要です。そして、会員制サイトを作成する際にも、結局HTML, CSS, JavaScriptの組み合わせは理解しておく必要があるのです。
つまり、プログラミングの初心者はPHP, Rubyより先にHTML, CSS, JavaScriptをある程度やっておかなければならないのです。これら3つの言語を学習するのに書籍を購入する必要があるでしょうか。答えはNOです。Web標準であるW3Cのドキュメントはいつでもインターネットで無料で読むことができますし、MDNというMozillaが提供しているサイトも便利です。ドットインストール、Schooなどの動画で学習するサイトもありますし、もし英語でよければUdacityやKhan Academyなんかもあります。
また、HTML, CSS, JavaScriptを学習するための開発環境はブラウザとテキストエディタだけであるということにも注目すべきです。大抵のテキストエディタはハードディスク容量やRAM容量を消費しません。ブラウザもそうです。あなたがもしその他の言語を学習したいのであれば、開発環境をインストールするか、クラウドの開発環境(paiza.io等)を使用する必要があるでしょう。
ではなぜ大抵のプログラマはJavaScriptに対して文句をいうのでしょうか。それは、自分が何々言語を勉強したかったのに結局JavaScriptを勉強させられているからです。そして、JavaScriptが何々言語よりもその人の好みの方向で劣っているからです。JavaScriptは特に静的型付き言語(C, C++, Java, Rust, Haskell, OCaml, ...)の人達の受けが悪いです。なぜなら動的型付け言語だからです。
でもあえて私は警告します。HTML, CSS, JavaScriptの組み合わせは、その他の言語よりもあなたを優位にします。間違えのない選択肢です。
JavaScriptがひどいバッシングを受けているので私のほうから反論をさせて頂きました。
投稿2018/08/09 11:34
総合スコア667
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/08/09 15:15
2018/08/10 01:05
2018/08/10 01:52

0
jsはやめとけ
Windowsでツールを作りたいならVisualStudio(無料)をインストールしてC#でWindowsアプリを作ったほうが早くて確実デバックもし安い
jsはやめとけ
移り変わりの激しい割に初心者泣かせで肝心のライブラリは有志まかせで解説サイトも散らばってるのでおすすめしない
jsはやめとけ
jsはブラウザで動く。でもnode.jsを使えばバックグランドでも動く。でもnode.jsでViewを作ると初心者にはしんどい
jsはやめとけ
画面は不要!全部コンソールでOKというならWindows Subsystem for Linux上でうごかした方が良いよ
投稿2018/08/09 04:23
総合スコア705
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。

0
ピンポイントに反応します。
C#は初心者にはオススメできない
どこのガセネタつかまされたのでしょう。。。
少なくとも、現在のWindowsでGUIアプリを作るなら、C#一択のように感じています。
投稿2018/08/09 05:36
総合スコア7196
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/08/09 06:08

0
jsは本来はブラウザの機能であるのでオブジェクトの掴み方が
基本的にブラウザに依存します。
ローカルでjsを動かすのが目的であればローカルのhtmlにjsを書いて
ブラウザで見れば済む話です。
単体でうごくjsとなるともはやそれはブラウザのjsではなくなるので
WinであればWSHなどに依存したjsとなり、結局vbsの方が使い勝手が
よかったりします。
投稿2018/08/09 03:36
総合スコア117601
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。

0
ElectronはWebアプリの技術でローカル(オフライン)でも動くデスクトップアプリを作るためのフレームワークです。なので、Webアプリを作るためのフレームワークではないです。あくまでもWebアプリを作るために使うHTML5やJavaScriptなどの技術ベースでできるという話です。
参考: https://ics.media/entry/7298
QiitaのKobitoなんかもElectronベースですので、ああいったGUIのアプリが作りたいのであればElectronは良い選択肢だと思います。
投稿2018/08/09 01:42
編集2018/08/09 01:44総合スコア36
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。

0
Linux または Mac なら nvm で node.js を入れます。
(node.js を入れる手段は nvm 以外にも複数存在します。)
Windows なら……
Windows でプログラミングするのは僕には難しすぎるので Linux を入れます。
試行錯誤すると環境が汚れてくるのでサクッとOS再インストールできたほうが良いです。
なので Windows に VirtualBox か何かをインストールし、
仮想OSとして Linux をインストールするのが良いと思います。
投稿2018/08/08 19:52
編集2018/08/08 19:54総合スコア2413
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/08/09 01:06

あなたの回答
tips
太字
斜体
打ち消し線
見出し
引用テキストの挿入
コードの挿入
リンクの挿入
リストの挿入
番号リストの挿入
表の挿入
水平線の挿入
プレビュー
質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。