【Python】もうprintデバッグはいらない？ / PySnooperで楽々デバッキング - フリーランチ食べたい
Hacker NewsとRedditでバズっていたPythonのデバッグツールが便利だったので紹介です！ PySnooperというライブラリです。 Hacker News - PySnooper: Never use print for debugging again Reddit - PySnooper: Never use print for debugging again ※追記 想像以上にたくさんの方に読んでいただき、printデバッグなど他のデバッグ方法との比較について追記として文末に補足しました。釣りタイトルですみませんでした…🙇 何ができるライブラリか 一言で言うと「デバッグがめちゃくちゃ簡単にできるライブラリ」です。 github.com 例を見たほうがわかりやすいと思うので見てみましょう。 インストールは pip で行えます。 pip install pysnooper
VSCodeを使い始めました。とりあえずデフォルトをイケてる感じにしたかったので、4つの拡張機能をインストールしました。せっかくなので共有します。 Before After 私と同じVSCode初心者は、とりあえず下記をインストールしておけばOKだと思います！ Dracula Theme Material Icon Theme Indent Rainbow Bracker Pair Colorizer 1. Dracula Theme まずはこれ。Dracula Themeです。 これを入れればシンタックスハイライトが変わり、かなり雰囲気が良くなります。デフォルトのハイライトだと特別感が少ないので、本当におすすめです。 追記：Dracula以外のおすすめThemeをこちらにまとめています。よかったら見てください。 VSCodeをカッコよくするTheme拡張7つ GitHub https:/
はじめに 一年前に新人研修でGitを担当してTigの記事を書いたのですが，今年も同じくGitの研修を担当することになりました．新人さんたちにとってはターミナル環境はとっつきにくい人も多いようで，短い研修期間では操作自体に苦戦してしまい，Gitそのものを理解するというところに力を割けない人も少なくありませんでした． それを踏まえて今回はGUIで操作しやすい環境を検討したのですが，以下のポイントを踏まえてVSCodeを使うことに決めました． マルチプラットフォームで使える．（研修はWindows環境で行いますが，業務ではLinuxデスクトップ環境も使うので） Gitの基本的な内容はVSCode上でGUI操作が可能． Gitの内容とあわせて，プログラミング用のテキストエディタの一例として，導入しやすそうなVSCodeを紹介． VSCodeを使ったGitの基本的な操作を一通りまとめていきます． イ
Web版VSCodeがDockerコンテナをWASM環境で起動、Webブラウザ内ローカルマシンとして利用可能に。拡張機能「vscode-container-wasm」登場
Web版VSCodeがDockerコンテナをWASM環境で起動、Webブラウザ内ローカルマシンとして利用可能に。拡張機能「vscode-container-wasm」登場 WindowsやMacなどのデスクトップPCでVisual Studio Code（以下VSCode）を利用して開発をする場合、同じローカルマシン上でDockerコンテナのLinux環境を起動し、VSCodeのターミナルで接続して操作することは、開発環境としてよくあることだと思います。 これと同じことをWebブラウザ版のVSCodeでも実現する、すなわちWeb版VSCodeが同一Webブラウザ上にWebAssembly化したDockerコンテナを起動し、Web版VSCodeからローカルマシンとして接続し利用できる、実験的実装を実現したVSCodeの拡張機能「vscode-container-wasm」が登場しました。 V
弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。 目次 1.はじめに 2.VSCodeの拡張機能紹介 3.コーディングのポイント 4.よく使われる英単語一覧 5.エラーとの向き合い方 6.テストで動作確認 7.検索の極意 8.公式ドキュメントに慣れる 9.リファクタリングでさらに読みやすく 10.資料作成で気をつけること 11.Gitで管理 12.よく使うLinuxコマンド一覧 13.仕事の進め方 14.プログラム以外で意識するところ 15.初心者こそ読んで欲しい本 16.まとめ 1. はじめに プログラミングは現代のデジタル社会において重要なスキルです。 AIがコードを書いてくれる時代ですが、それでも人の手によるプログラ
文章の校正チェックを自動で行うVisual Studio Codeの拡張機能「テキスト校正くん」を弊社からリリースしました。無料で利用できます。 テキスト校正くん – Visual Studio Marketplace 短い文章であれば目視でもチェックできますが、長文になるとチェックに時間がかかり見落としも多くなってしまいます。また、いくら内容のいい文章を書いても誤字や脱字が多く体裁が整っていないと、印象が悪く読みづらい文章になってしまいます。 そんなとき、「テキスト校正くん」を利用することで、文章チェックの手間を軽減でき、文章の品質を高めることができます。 ▲VS Codeの拡張機能「テキスト校正くん」 「テキスト校正くん」でできること この拡張機能は、VS CodeでテキストファイルやMarkdownファイル等の日本語の文章をチェックします。編集時に自動で校正のチェックを行い、エディタ
追記 versionによっては設定を変えないとエクスポートができないようです。 エクスポートできない方はこちらの記事をご参考に設定いただくとエクスポートできるかもしれません。 現状バージョン0.4ではこちらの設定が必要となります。 VSCodeでDraw.io Integration使用時にエクスポートできないことがある問題への対処 2020/10/18追記 現在のバージョン0.7ではdrawio拡張子のエクスポートがうまくいかないようです。 その場合はオフラインモードに移行変更していただくか、drawio.pngやdrawio.svg拡張子でファイルを作成してもらうことで直接編集もできた上で、エクスポートとせず末尾の拡張子ファイルとして利用することができます。 はじめに VSCodeで簡単にDraw.ioで描画できるようになったみたいなので、 導入方法と使い方を備忘として残していきます。
プライベートでMac使うのやめた
最近、自分のプライベートの開発環境を大きく変えたので紹介する。 先にまとめ プライベートではMacを使わなくなった 家にUbuntuが入ったミニPCを置いた 外からはThinkPad X1 CarbonからTailscale経由のSSHで家のミニPCに接続 購入まで まず、自分にとって最も大きな変化はプライベートでMacを使わなくなったことだ。2013年くらいにプログラミングを始めてからずっとメインのOSはMacだったので、約10年ぶり、ほぼ初めての非Mac環境である。 自分の普段の開発のユースケースは、Webアプリケーション開発とNode.js上で動くソフトウェアの開発、WebKitへのコントリビューション、たまにRustやGoやC/C++で自分専用ツールの開発、くらいなので別にMacで困っているわけではなかった。Web開発やNode.js上のソフトウェアの開発はまあ普通にMacで困らな
「Visual Studio Code（略称：VS Code）」はMicrosoftが提供している無償で高機能なエディターです。標準でも十分な機能は備わっていますが、拡張機能をインストールすることで、より使いやすく自分にあったエディターにカスタマイズできます。 前回の記事では、「HTMLコーダー」「フロントエンジニア」に役立つ拡張機能を紹介しました。本記事では、開発者全般の方に役立つ拡張機能を紹介します。 エディターを強化する拡張機能 1. Clipboard Ring テキストを「コピー」や「切り取り（カット）」したものを「貼り付け（ペースト）」する場合に、この拡張機能を入れることで複数件の内容を記憶できます。ctrl+shift+v（⌘+shift+v）を押すごとに過去の情報に切り替えられます。デフォルトでは10件の情報を記憶できますが、設定を変更することで記憶する件数を増やすことも可
ファイル比較 VSCodeのエクスプローラで、ファイル２つを選択して右クリックメニューから「選択項目を比較」で比較することができます。 また右クリックで、「比較対象の選択」をした後に「選択項目を比較」でも比較することも可能です。 VSCodeのSnippetの使い方 VSCodeのSnippetも便利です。似たような構造のクラスを実装する場合などや、プロジェクト共通で使いがちな書き方というものをSnippetに登録して、効率化することができます。 また、変数を持たせておくこともできます。この場合、Snippetを呼び出した後に変数部分にカーソルがあたるので、そこで変数部分をタイピングできます。 詳細は以下のリンクをご覧ください。 Visual Studio Codeに定型文（スニペット）を登録する方法 VSCodeのUser Snippetを活用しよう！ また後述するSnippet Gen
「Visual Studio Code（略称：VS Code）」はMicrosoftが提供している無償で高機能なエディターです。標準でも十分な機能は備わっていますが、拡張機能をインストールすることで、より使いやすく自分にあったエディターへとカスタマイズできます。 本記事では、HTMLコーダーやフロントエンドエンジニアに役立つ拡張機能を紹介します。 1. IntelliCode IntelliCodeはMicrosoft謹製の公式プラグイン。AI支援による次世代のコード補完がJavaScriptやTypeScriptで利用できるようになります。APIの一覧がアルファベット順に提示されるのではなく、利用する可能性の高いAPIがAIによって予測されます。 コード補完の様子を次のスクリーションショットでご覧ください。入力候補の「★」マークが付いているところが、補完候補になっているところです。人工知
ChatGPTとは？ OpenAIが開発するGPT-3という言語モデルをベースとした(執筆当時)チャットアプリです。 こちらの質問に対して、AIが色々な質問に答えてくれて、一般的な内容だけではなく、コードレビューやバグなども発見してくれるめっちゃ凄いやつです。 細かい内容は以下の記事がとても参考となります。 筆者の関連記事 VSCodeと連携して、ブラウザを開かなくてもChatGPTを使用できるようにする 通常はブラウザを開いて使用するのですが、コーディング中にサクッとレビューしてもらったり、バグを見つけてもらえるような拡張機能があったので、そちらの設定方法について記述してみます。 今回インストールする拡張機能 使用までの手順 環境 PC: MacBook Pro (Apple M2) OS: macOS Ventura 13.1 VSCode: v1.74.3 OpenAIの価格について
［速報］Windows用パッケージマネージャ「winget」がプレビューリリース。コマンドラインからアプリケーションをインストール。Microsoft Build 2020
オンラインイベント「Microsoft Build 2020」を開催中のマイクロソフトは、コマンドラインから利用するWindows用パッケージマネージャ「Windows Package Manager」のプレビューリリースを発表しました。 Windows Terminalのコマンドラインから「winget install」と入力、実行するだけで、アプリケーションがWindows 10にインストールされます。 例えば「winget install powertoys」と入力すればpowertoysが、「winget install vscode」と入力すればVisual Studio Codeがインストールされる、という具合です。 インストールはあらかじめ用意されたmanifestファイルに従って行われます。 Windows Package ManagerはGitHub上でオープンソースとし
WSHを始めよう － ＠IT
連載目次 わたしたちはコンピュータの奴隷じゃない！ Windows PCを使っていて、あるいはWindowsサーバを管理していて、「何で人間様が、こんなこまごまとした作業を繰り返し、何度も何度もやらないといけないの？」と思うことはないだろうか。例えばこういう作業はどうだろう。 「My Documentsフォルダ内にある2005年に作成されたファイルのうち、最近1カ月更新してないテキスト・ファイルの中身を確認したいので、それらのファイルの1行目を抜き出して1つのテキスト・ファイルにする」 これを手作業でやろうと思うと大変だ。まずエクスプローラでMy Documentsを開き、詳細表示モードにし、作成日時と更新日時をにらめっこしながら該当するファイルを選び、メモ帳で開いて1行目をコピーし、もう1つメモ帳を立ち上げてそれを貼り付け……、という操作を複数のファイルで繰り返す。フォルダが階層化されて
はじめに 今回はVSCodeでおすすめの拡張機能を分野別に紹介していきます。 拡張機能は下記の分野に分けて紹介していきます。 VSCodeを使う全員向け Web制作関連 HTML&CSS関連 WordPress関連 フロント向け JavaScript React Vue サーバーサイド向け PHP Ruby その他 拡張機能を利用することで開発の生産性を上げることができるので、ぜひ参考にしていただければなと思います。 この記事の対象者 プログラミング初心者の人 分野別におすすめの拡張機能を知りたい人 開発の生産性をより上げたい人 VSCodeを使う人全員向け まずはじめにVSCodeで開発をしている人、全員におすすめをしたい拡張機能を紹介しておきます。 自分自身が使った拡張機能の中で「とりあえず入れて損はない」というものを厳選しています。 それでは紹介していきます。 Japanese La
VS Code（Visual Studio Code）エディタを便利に使うための拡張機能 - karaage. [からあげ]
追記：VS Codeの入門書をZennでリリースしました ブログで扱ったVS Code関連の記事をまとめて、無料の電子書籍としてZennというプラットフォームでリリースしました。よければ、こちらも参考にしてみてください。 VS CodeにVimから乗り換えようと思った 普段、プログラムを書くためのエディタは3年くらい前からVimを使っています。 軽量ですし、大体どんなマシン（OS）でも入れられるので、プラグインとか色々入れて機能拡張していました。ただ、デバッグとか色々辛くなってきたので、IDEのエディタもまた使ってみようかなと思い、最近評判の良いVS Code（Visual Studio Code）に手を出しはじめてみました。 この記事では、VS Codeに入れている拡張機能を自分のメモがわりに書いておきます。 なお、VS Code自体のインストール方法は割愛します。以下公式サイト参照下さ
![VS Code（Visual Studio Code）エディタを便利に使うための拡張機能 - karaage. [からあげ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/35eabb0e1b8fb6d0e8ee43a1e132e736c438295b/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkaraage%2F20180929%2F20180929115011.png)
弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。 はじめに VSCodeは世界で多くの人が使っているコードエディタです。 開発の際に使用している人も多いのではないでしょうか。 今回はそんなVSCodeの拡張機能を一挙に紹介していきます。 拡張機能 VSCodeは世界中で支持されているコードエディタですが、最大の魅力が「拡張機能」です。 機能を追加して、より自分が使いやすいコードエディタにすることができます。 拡張機能のインストール 拡張機能のインストールのやり方を説明します。 アクティビティバーの拡張機能マークをクリックする（四角が4つあるマークです） インストールしたい拡張機能を検索する 拡張機能を選ぶ インストールをク
Google Apps ScriptsでTypescriptが超簡単に使えるようになった！ - アクトインディ開発者ブログ
morishitaです。 Cloud Functions と並ぶ(?)Google のサーバレスな JavaScript 実行環境といえば Google Apps Scripts（GAS）です。 GAS ってあの Excel で言う VB スクリプト環境のようなものでしょう？ と思ったあなた！ このエントリでその認識が変わると思います。 以前は使いやすいとは言い難かったGASですが、最近は使いやすくなってきました。 といっても、GAS 自体がアップデートされたのではなく周辺ツールが整備が進み開発・運用しやすい状況が整ってきたからです。 そして、なんと最近Typescript でとても実装しやすくなったので、それをご紹介したいと思います。 google/clasp 以前の GAS は Web エディタ上でしか実装できず、コードを VCS で管理することもままならない状況でしたが、Google
TL;DR ブラウザ上でほぼVS codeが使えるクラウドIDEサービス「Coder」 他のVS codeライクのクラウドIDEと異なるのは「拡張機能がそのまま使える」。大半の拡張機能を利用可能 現在はアルファ版 ChromebookやiPadでの利用も想定している Dockerコンテナにプロジェクトを作成するので自由度が高い 無料プランでも十分に使える。他のクラウドIDEと比べて月額費用が安い Fast Time機能を使うと時間制で96CPUコア、メモリ16GBが利用可能(課金で殴る開発駆動) コラボ機能で1つのプロジェクトで複数ユーザでペアプログラミングができる(未確認) きっかけ 2019年2月28日の夜、「あれ、VS codeライクなクラウドIDEってなんて名前だっけ？」という疑問から 「Cloud IDE vs code」 でググったところ以下の検索結果が表示。 ここで目的である
各機能とツールについて、説明していきます。 エディタ Visual Studio Code エディタやIDE(統合開発環境)は好きに選んでいただければ良いとは思いますが、特に希望がないならば、Visual Studio Codeを選んでおけば間違いないでしょう。 Pythonを含む幅広い言語に対応し、豊富な拡張機能を備えている非常にリッチなエディタです。とりわけPythonプロジェクトについては、これさえ有れば、特にIDEなどは必要ないと思います。 インストールは↓から。 バージョン管理ソフト Python3系は日夜アップデートされていて、2022年12月現在の最新verは、3.11.1が提供されています。 とはいえ、プロジェクトによっては、3.7.1までしか動作が担保されていないもの、3.9.0で現在開発中のもの...などがあります。最新のPythonが常に必要、というわけでは決してなく
組み込み端末のアプリケーションに Electron を採用し開発・運用を行っています。 継続的な機能追加やトラブルサポートを行いながら 3 年が経過したので、Electron を採用した経緯や結果を経験を交えながら共有したいと思います。 組み込み案件自体が初めてでしたのでその話も入っています。 約 700 台ほど導入されており、なかなか大きな案件での採用と思いますので参考になれば幸いです。 ※Electron の基本的な説明は割愛します。 システムについて 一般的に「受付精算機」などと呼ばれ、店頭に何台か並べて設置して自動で受付・精算を行うシステムです。 ホテルの受付端末のイメージです。ハード的にはセルフレジにも近いです。 筐体自体は他社が用意し、弊社はその上に載せる GUI アプリケーションのみを担当しました。 機能 主な機能として 来店受付・整理券発行 予約チェックイン チェックアウト
Mac OS初期設定 開発用ソフトをインストールする前に、まずはMac OSの設定を整えて使いやすいデスクトップ環境を構築します。 初期設定 電源を入れると、色々と初期設定が求められます。基本的には指示に従って進めればOKです デスクトップ設定 まず電源を入れて目につくのが、下のDockが大きくて邪魔だということです。 その他にもスクロールの向きがWindowsと逆だったり、Finder(Windowsでいうエクスプローラ)が使い辛かったりするので、 以下のYouTubeチャンネルを参考にして設定し直すと、使いやすくなるかと思います。 OSアップデート 購入直後のOSはバージョンが古くなっていてセキュリティ的に脆弱なことがあるので、アップデートします。 基本的には初回起動時に自動でアップデート画面が出てきますが、以下の方法で手動アップデートも可能です ・Dockから「システム環境設定」を開
神アップデート！ Win, Mac, Linux対応、クラウドでの同期機能も備えた最強のコードスニペットマネージャー -massCode
HTML, CSS, JavaScriptをはじめとしたさまざまな言語に対応、クラウドでの同期機能も備えたオープンソースのコードスニペットマネージャー「massCode」がv3に神アップデートされたので、改めて紹介します。 macOS, Windows, Linux対応、日本語の入力など日本語環境も完全サポート。クラウドで同期できるので、すべての環境で同じコードスニペットを使用できます。 非常に快適で高速に動作し、VS Codeとの連携でさらに便利になっています！ massCode massCode -GitHub massCodeの特徴 massCodeのダウンロードとインストール massCodeの使い方 massCodeの特徴 massCodeは、デベロッパー向けのコードスニペットマネージャーです。ライセンスはGNUで、オープンソースなので商用でも無料で利用できます。 macOS 1
はじめに インストールすればすぐに書けて動かせるのが魅力のPythonですが、 実際に業務などでキチンと書こうと思ったら Pythonのバージョン管理ツール パッケージマネージャー エディター(IDE) リンター フォーマッター 型チェッカー くらいは最低限用意する必要があります。 しかしこの界隈、怒涛の勢いで日々新しいものがリリースされていて一概に「これがベストプラクティス」を提示するのが難しいんですよね。そこで今回は上記それぞれのツールについて「こんなものがあるよ」というのをご紹介したいと思います。 TLDR バージョン/パッケージ管理はpyenv + Pipenvがスタンダードだった時代は終わった VS CodeかVimを使うなら型解析にPyrightを導入するとよい テンプレートを用意しました 1. バージョン/パッケージマネージャー プロジェクトごとに異なるPythonのバージョ
リモートワークの設計と運用 / または Discord + VSCode LiveShare がいいぞという話 - mizchi's blog
この記事読んで自分のリモートワーク経験からどうやるのが今一番良いだろうか、という話をずっと考えていたので、書き出してみました。 リモートワークをする人必読。組織パフォーマンスを左右する「デジタル心理的安全」とは？ | 未来を変えるプロジェクト by iX（アイエックス） 自分自身はフルタイムリモートとフリーランスでのリモートの2つの経験があります。 次の会社が申請すればリモート可というスタイルなのですが、自分がリモートワークする場合、働く環境に期待しているのはこういうことだ、というのを事前に宣言しておく目的もあります。 フルリモートではなく、部分的なリモートを想定しています。 リモートワークに期待すること リモートワークは、基本的には「うまく運用すれば効率が下がらない」というものです。リモートワークで効率が上がることもありますが、基本的にはある種の福利厚生、雇用競争力のためと割り切ったほう
私はWeb制作会社を経営しており、2023年現在で36歳になります。 28歳の時にWebデザイナーに転職してWeb業界でのキャリアをスタートさせ、32歳で独立しました。 この記事では、私が28歳の時に未経験から独学でWebデザイナーに転職した方法を紹介しています。 効率的な勉強方法や習得すべきスキル、転職活動のコツなど、Webデザイナーを目指している人におすすめの内容になっています。 また、今はWebデザイナーを採用する立場になっているので、「こんな人を採用したい」という視点も加わっています。 28歳（当時）の未経験がWebデザイナーに転職 Webデザイナーになるまでは、Webデザインどころか、デザインの仕事やプログラミング、Web関係の仕事すらやったことがありませんでした。 最初からデザインのセンスがあったわけでもなく、今見るとWebデザインの勉強を始めた頃作ったサイトは酷いものでした…
上記のようにコードエディタを開くコマンドを分けるために、既にcodeコマンドをVScodeで使っている方はcursorダウンロードの際にcursorコマンドのみインストールするようにしてください。codeの方もインストールすると、codeコマンドでVScodeとCursorどちらも開いてしまうようです。 Cursor主要機能紹介 cmd + Shift + L or cmd + L でGPTとChat機能 エディタ上で画面右にGPTに質問できるサイドバーが出現する。何も選択してないと無から質問できる状態になっていて、コードを選択した状態で開くとそのコードがあらかじめ引用された状態になっている(別の部分のコードもどんどん追加できる)。 ↑10~21行目をcmd + Lした後に31~33行目を追加でcmd + Lした画像 cmd + K でAI Edit機能 コードを選択した状態でcmd +
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter. テキスト校正くん VS Code上でテキストファイル・Markdownファイル・Re:VIEWファイルの日本語の文章をチェックする拡張機能です。該当のファイルを開いた時、更新した時に自動で校正のチェックを行い、文章内の問題のある箇所をマーキングし問題パネルにエラー内容を表示します。 メールの文章を作成する際やブログ記事の文章を作成する際などに、ご使用いただくと便利です。 ウェブ業界の専門用語を含め、一般的な文章のルールに沿って主に以下のようなチェックを行います。 「ですます」調と「である」調の混在 誤検出の回避のため「である調」の判定は明らかに常体な「〜である」のみとなっています。 ら抜き言葉 二重否定 同じ助詞の連続使用（※初
これでprintデバッグから卒業！VS CodeでPythonデバッグ入門 - karaage. [からあげ]
追記：VS Codeの入門書をZennでリリースしました ブログで扱ったVS Code関連の記事をまとめて、無料の電子書籍としてZennというプラットフォームでリリースしました。よければ、こちらも参考にしてみてください。 printデバッグから卒業したい！ プログラムを書いて問題があったとき必要なのがデバッグですね。私はいつも問題が起こったとき、問題ありそうなところで print(ほにゃらら)として、気になるものを一つずつ中身を確認していました。 デバッガという言葉は知っていて、何度か試したことはあるのですが、いちいちコマンドを打つのが大変で、次にデバッグが必要なときは既にデバッガの使い方を忘れてしまい、結局また1からprintデバッグをするという体たらくでした。 しかし、いい加減もうちょっとレベルアップしないといけないと思い立ったのと、VS Codeというエディタを使いこなすと結構楽にデ
![これでprintデバッグから卒業！VS CodeでPythonデバッグ入門 - karaage. [からあげ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/9774b3310e690eda1669fae9a094d513dc4713c5/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fk%2Fkaraage%2F20190210%2F20190210135909.png)
OSS 観光名所を貼るスレ - ぽ靴な缶
これは はてなエンジニアアドベントカレンダー2023 2日目の記事です。 はてなエンジニア Advent Calendar 2023 - Hatena Developer Blog はてなエンジニアのカレンダー | Advent Calendar 2023 - Qiita トップバッターは緊張するけど、順番が回ってくるまで長い間ソワソワするのも嫌、という理由で例年2日目を狙うようにしている id:pokutuna です。今年も成功しました。 観光名所とは 目を閉じれば思い出す、あのコード... あの Issue... あなたが Web 系のエンジニアであれ、趣味で開発している方であれ、必要に応じてライブラリやフレームワークのコードを読むのはよくあることでしょう。公開の場で開発されているソフトウェアは、ソースコードだけでなく、開発コミュニティでの議論やバグ報告なども見ることができます。 リポ
拡張機能はできるだけ最小限にしておきたい派です。そんな自分がインストールして使い勝手がよかった拡張機能をいくつか紹介します。 Auto Close Tag https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag その名の通りClose Tagを自動で入力してくれます。単純にタイピングが減るので肉体的・心理的負担の軽減にもなります。 Auto Rename Tag https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag タグを修正した際にClose Tagも合わせて修正してくれます。これも手間が減って便利です。 Bracket Pair Colorizer 2 https://ma
Simple Cloud Infrastructure for Developers | DigitalOcean
Dream it. Build it. Grow it.Whatever your vision—a SaaS app, an AI/ML business, a website, an eCommerce store—build it here using DigitalOcean's simple, cost-effective cloud hosting services.
2020年後半版Vue.jsを使ってる人には必ず知っていてほしいVue.jsの武器とドキュメントに書かれていないコンポーネントやメンテナンスの際に役立つTips - Qiita
2020年後半版Vue.jsを使ってる人には必ず知っていてほしいVue.jsの武器とドキュメントに書かれていないコンポーネントやメンテナンスの際に役立つTipsJavaScriptTypeScriptVue.jsフロントエンドvue-cli はじめに 最近iCAREさんの所でVue.jsを一緒にやらせていただいているのですが、フロントの技術スタックがGraphQL + Vue.js + TypeScriptで開発しており、そこでのVue.jsの開発体験がかなり良く、iCareさんの詳細なノウハウを公開しても良いと言っていただけたので、言語化し、整理して、共有出来たらと思います. ※ いつも通り記事の内容に意見がありましたら直接編集リクエストをください 前置き 今回のサンプルは@vue/cliを利用し、プリセットはTypeScriptだけいれときました. versionは2020年7月16日
はじめに Web開発といえばUNIXターミナルが使えるMacが便利だったが、ついに今年WSL2が正式リリースされた。これでようやくWindowsでまともなWeb開発環境を構築することが可能になって喜びもひとしお。 それどころか、WSL2, Windows Terminal, VS Codeと便利なツールがどんどんリリースされていてMacよりも便利といえる環境になってきたため、本格的にWindowsに乗り換えることにした。 環境構築をメモしていく。 WSL2とUbuntuのインストール 公式ドキュメント通り。 ディストリはUbuntuを選んだ。 Windows Terminal マイクロソフト純正。とても使いやすく、アップデートも精力的で今後も楽しみ。 Microsoft StoreからWindows Terminalをインストール 設定ファイルがJSONなのはエモいですね。 この辺で好きな
こんにちは、m3 エンジニアリンググループ CTO 矢崎(id:Saiya)です。 過去に Go 言語の仕様を一通り見た経験があったのですが、久しぶりに Go のコードを最近読み書きした際に、ここ数年の Go 言語やエコシステムの進化による変化もあり、発見やハマりが多々ありました。 Go 言語公式のロゴもスピード感ありますね。 同じような迷い・回り道をしてしまう方ももしかしたらおられるのではないかと思いますゆえ、 エムスリー Advent Calendar 2020 6 日目の記事として、筆者が実際に「最初から知っていれば時間を無駄にしなかったのに...！」と感じた知見をざっくばらんにシェアいたします。 本記事がどなたかの一助になりますと幸いです。 なお本記事の内容は筆者個人の理解・自身で直接読み書きしたユースケースの範囲での知見であり、全ての Go 利用事例に当てはまらない点も含みうりま
Visual Studio Codeの代替を狙う統合開発環境「Eclipse Theia 1.0」リリース。VS Codeの拡張機能を利用可能、デスクトップ版とWebブラウザ版に両対応
Visual Studio Codeの代替を狙う統合開発環境「Eclipse Theia 1.0」リリース。VS Codeの拡張機能を利用可能、デスクトップ版とWebブラウザ版に両対応 Eclipse Foundationは、オープンソースで開発されている統合開発環境「Eclipse Theia 1.0」のリリースを発表しました。 Eclipse Theiaは、「真のオープンソースによるVisual Studio Codeの代替」（a true open source alternative to Microsoft’s popular Visual Studio Code (VS Code) software）だとEclipse Foundationは紹介しており、デスクトップアプリケーションだけでなくWebブラウザからも同一機能が利用できるWebアプリケーション版も提供されています。
VS Code ネタ詰め合わせ - Qiita
👻 ぷぇ 🍾🍾🍾 メリークリスマス！！！ 🎉🎉🎉 今年も残り僅かですが、皆様の今年の進捗はどうだったでしょうか？ 進捗ダメでしたか？ 私はと言うと今年も幸い GitHub で evergreen を達成できそうです。( 業務でこの GitHub アカウントは使用していないので、個人での Contributions のみです。 ) Visual Studio Code Advent Calendar 2019 の最後の記事ともなりますし、普段、特に Qiita ではあんまり記事を書かないのもあるので、 VS Code に関するいろいろなネタの詰め合わせをお送りします。 自分的に VS Code の二大拡張 ※ステマ注意 VS Code Tips 来年(2020年)の VS Code 余談: アイコン騒動、再び！！ 自分的に VS Code の二大拡張 ※ステマ注意 「もしも V
📌 はじめに Pythonで開発を行うにあたり、リンタやフォーマッタ、パッケージマネージャ等のツールの選定は非常に重要な問題です。一方で歴史的な経緯もあり、沢山の選択肢から何を選ぶべきか情報がまとまっていないように感じました。この記事では2021年9月時点でモダンと言えるであろう開発環境を紹介します。基本的にはシェアが高いこと、著名なパッケージで使用されていることを主な選定理由としており、また特定のエディタに依存しないことを前提とします。 本記事で紹介する内容は一つのテンプレートに近く、必要に応じてカスタマイズするもよし、そのまま使ってもよし、として参考になればと思います。(CI/CDについてはPythonとは独立した問題なので触れません。またドキュメント生成はSphinxを推しますが、必須ではないので今回は割愛します。) 📄 要約 "モダン"な開発環境を箇条で列挙すると下記の通りです
VS Codeでコードがさらに見やすくなる！ ネストされたブロックを強調表示するVS Codeの機能拡張「Blockman」
HTML, CSS, JavaScript, PHPなどさまざまな言語に対応、コードのネストされたブロックを枠で囲って強調表示するVS Codeの機能拡張を紹介します。 さっそくインストールして使用してみましたが、これは見やすくなりますね！ 枠のボーダーや背景、ネストの深さを自由に変更もできるので、自分が見やすいようにカスタマイズできます。 Blockman -GitHub Blockmanの特徴 Blockmanのインストール Blockmanの使い方 Blockmanの特徴 Blockmanは、コードのネストされたブロックを強調表示するためのVS Code拡張機能です。 サポートしている言語は、JavaScript, JSX, TypeScript, TSX, C, C#, C++, Java, Ruby, PHP, R, Go (Golang), Dart, Rust, Swift,
こんにちは。エンジニア組織開発責任者の id:kfly8 です。 はじめに 最近、COVID-19の影響で、在宅で勤務している方が増えているかと思います。モバイルファクトリーでは2月中旬から原則在宅勤務になり、家の開発環境をこの機に整えている声などを聞きます。 そこで、今回は弊社のメンバーに在宅の開発環境のこだわりなどを聞いてみました*1 尚、この記事はGunosyさんのこの記事にインスパイアされた記事です。 tech.gunosy.io 1人目 1人目は、デザイナーの@momoyagiです。 普段はMBP本体＋ディスプレイ2枚で開発していますが、自宅環境はMBP+ディスプレイ＋気分転換用にipadになっています。デザイナー職のため、会社支給のwacom ペンタブレットを持ち帰ってます。デバイスが少し多いので配線管理がつらい。 在宅開発環境の良い点 周りがうるさいと集中できないので、一人の
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
インストールするだけでVSCodeをカッコよくする拡張4つ - Qiita
VSCodeでのGitの基本操作まとめ - Qiita
【11万文字越え】プログラミング初心者に贈る即戦力ガイド - Qiita
文章作成・メール作成に役立つ！ VS Codeの拡張機能「テキスト校正くん」を公開 - ICS MEDIA
VSCodeでDraw.ioが使えるようになったらしい！ - Qiita
VS Codeを極める！ MarkdownやGitにもオススメの拡張機能9選 - ICS MEDIA
主にVSCodeではじめるPython開発環境構築ガイド | DevelopersIO
VS Codeを使いこなせ! フロントエンジニア必須の拡張機能7選 - ICS MEDIA
VSCodeにChatGPTの拡張機能を入れてコードレビューやバグを発見してもらう - Qiita
【分野別】VSCodeのおすすめ拡張機能まとめ - Qiita
Visual Studio Codeに入れるべき拡張機能【2023年最新版】 - Qiita
ブラウザでVS codeが使えるクラウド IDEの大本命「Coder」 - Qiita
2022年度版Python環境構築徹底解説 - Qiita
Electronで組み込み端末向けアプリケーションを開発し3年間運用してみて
【M1 Pro/Max対応】M1 Mac環境構築ベストプラクティス - Qiita
2020年5月におけるPython開発環境の選択肢 - Qiita
全くの未経験が独学でWEBデザイナーに転職するまで | SHIROMAG
新時代のコードエディタ、Cursorのメリット・できることを網羅的に解説した
テキスト校正くん - Visual Studio Marketplace
開発が捗る Visual Studio Code 拡張機能 - Qiita
WSL2でWeb開発環境の構築メモ (zsh, node, dockerなど)
今どきの Go の書き方まとめ (2020 年末版) - エムスリーテックブログ
【2021】モダンなPython開発環境の紹介 - Qiita
突撃！在宅の開発環境 2020年春 - Mobile Factory Tech Blog