スキップしてメイン コンテンツに移動

投稿

ラベル(vscode)が付いた投稿を表示しています

Flutter - インストールからAzure Web Appに登録まで超々入門!

最近Flutterがいい! とかよく言われてるので触ってみました! 私の場合はFlutterを利用してモバイルとかPC用のWeb環境を作ろうと思いました。余裕があったらそのままモバイルアプリも作れるからいいなと思ってこれを選択しましたね。 ここではWindows環境でVSCodeを利用してAzureのサーバーレスのWeb Appを利用する書込みです。マイナー過ぎて本当に大変でした。AzureのWeb AppにはFlutterを基本でサポートしてないのでNode.jsを利用してアップすることになります。 では早速Flutter SDKをダウンロードしましょう。 https://flutter.dev/docs/get-started/install 私はWindowsを使ってるのでWindowsを選びました。最近モバイル開発環境でよくMacを使ってるユーザーが多いですが、Windowsはマイナーになって書込みがあまりありません。色々想像しながらやるしかありませんでした。 次はFlutterをいじるツールをインストールしないとですね。 https://code.visualstudio.com/download 私の場合はVSCodeをよく使うためVSCodeにしました。 特にAndroidとかiOS用開発はしないと思いましたがスマホの仮想マシンもVSCodeから起動できることを知りました! 次はFlutterをVSCodeに繋ぎこみ! ViewメニューからCommand Paletteを選択 上にカーソルが移動したらInstallをタイプ するとメニューが出てきてExtensions: Install Extensionsを選択 左にExtensionが出てきたらFlutterを検索 Dart CodeのFlutterを選択してください。FlutterのExtensionがいっぱい出てきて何が公式なのか分からなかったので色々やってみたらこれでした。 インストールが終わったらFlutterが正常にインストールされたか確認ができます。 同じくCommandPaletteを開いてもいいですが、私は下のTerminalからやってきました。 PS> flutter doctor そしたら何がいっぱい出てきてAndroid Studioがありませんとかの警告が出ました。An...

VSCodeとGithubの相性を利用する!

VSCodeはProject毎に開くのもいいかもしれないが、 普段複数のプロジェクトと自分の整理などもあるので1段階上のフォルダを開くと便利になる。 例えば D:\lowywork\Project をVSCodeから開く。 そして自分の作業したい内容をGithubから登録しCloneをする。 VSCodeにはTerminalが表示されるのでVSCodeでそのまま`git clone`を利用して複数のプロジェクトをCloneできる。 それでできたのが D:\lowywork\Project\ASiteDev D:\lowywork\Project\LowyEnv D:\lowywork\Project\MLTest となってたらVSCodeではすべてのレポジトリーに対して同期チェックが行われる それは左メニューの上からの3番目Source Controlのところに自動的に変更状況が表示される。 そしてプロンプト間にすぐ移動ができる状況になる。 例えば、 作業の記録をLowyEnvでやってたら LowyEnv/README.mdにASiteDev/Intro.phpソースの記録をする場合 README.mdに下記のように記載すると[ctrl + click]で簡単に移動できる。 [Introl.php](/ASiteDev/Intro.php) 現在VSCodeで開いたフォルダがルートフォルダになってそれを基準に移動ができる。 しかし、プロンプト内では相対パスを使わないとそのプロジェクトだけ開いた人またはGithubではルートが`/Project`ではなく`/ASiteDev`になってしまうためリンクが合わなくなるので注意が必要。 このように管理すると 自分専用の作業場にすぐ行ける環境作成ができて、 全ての作業が記録として残しやすくなる。(リンクを作ってからクリックして開くためすべてが繋がり、ちょっとしたコメントで十分管理ができる) VSCodeとGithub(Gitlabも可能)の相性がすごくいいのでみんなやってみてください!

UiPath(MS Workflow Foundation), VS CodeとNode.jsのいいところ

UiPathが使い勝手がよくてVS Workflowよりもっと使ってます。 ここで気づいたのが、 Nodeの便利さが似ている。 Nodeは1台のサーバーに異なるコンポーネントの多数のサービスができる仕組みです。 サービスルートディレクトリ(Service root Directory)のProject.jsonファイルに定義されたコンポネントのバージョンなどを読み取り各プロジェクト毎の必要なコンポネントがロードされます。 もし設定間違いで治せなくなったらディレクトリを削除し作り直してソースだけコピーすればOKです。 今までならインストールしたコンポーネントのせいでOSからインストールしなおさなければならないケースが多数あったんですが、Node.jsのおかげでその手間が結構省けました。 これと同様に MicrosoftのWorkflow FoundationはRPAまたはDevOpsのツールを作成するとき使用され、MSの一番の問題の.NetframeworkとかWindows OSに依存するいろんなツールのインストールで焦げたりする設定がすぐやり直しができるようになりました。 MS Workflow Foundationを元に作られたUiPathも同様に各プロジェクト毎のコンポーネントバージョン設定が自由にできて1台の開発環境でも様々なコンポーネントのバージョンが使えるので多数のプロジェクトが開発できるようになりました。 そしてこのプロジェクトの管理をVS Codeでまとめて管理することでもっと楽に管理ができます。 もしLinuxが慣れてる方なら常にTERMINALを開いた状態で開発をするとviが開いた状態でコマンドが打たれる理想的な開発環境の作業ができます。 最後に自分でVS Codeのコンポーネントの開発ができるのでここまで出来たらもうVS Codeの達人と言えるでしょう。 今までの開発ツールのなからかなり軽くて対応言語が多いVS CodeはマイクロソフトのOpen Sourceサポートの政策を反映していると思います。 ちなみに全世界でLinux及びOpen Sourceサポート企業のなかで一番投資及び貢献が多かったのがマイクロソフトだったのをご存じでしょうか? 私も知りませんでしたが、この前関係者さんから直接に...

VS Code(Microsoft VisualStudio Code)をGit(Github、Gitlab)レポジトリー同期

プロジェクトが多いとき各プロジェクト毎にVS Codeで開くのは面倒で色々やってみました。 Githubクライアント(Windows Client)で一々同期させたら 時間が掛かりすぎてダメ。 ちなみに管理中のプロジェクトが約20個。 UiPathというRPAツールを利用してGithubクライアントを自動同期させてみたら なんとなく動いたけどかなり時間が掛かる。 Batchファイルを作って自動同期させてみたら 勝手に同期している最中に焦げた! git pushをしたくないときしちゃったりしてほかのメンバーとの衝突が発生。 VS CodeのExtensionのなかでgitクライアント連携して その上位のフォルダを開いたら なんと! 一気に全てのプロジェクトをチェックし、同期がしやすくなりました! とのことで、 現在はVS Codeでソースを管理してます~ SQLファイルの修正とかJavaとPHP、.Netなどの言語が変わってもExtensionさえインストールしとけばなんでもコントロールできます! コマンドはTerminal機能でやってるし。 DBデータが見たいときはデータを見るExtensionをインストールすればOK。 ちょっと不便なところは Extensionがだれでもアップできて 何がいいのかわからなくいっぱい出てくる。 プラットフォームの意味を充実に実現したのですが、その短所を考えて作らないと…ですね。