0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Visual Studio CodeでMarimoを使ってみる

Last updated at Posted at 2025-08-03

はじめに

次世代のPython Notebookとして「Marimo」が登場しました。
marimoについて参考:

Visual Studio Codeの拡張機能として使うことができるということで、環境構築から試してみました。

今後使用を重ねていく中で更新を加えます。(予定)

環境

  • Windows11
  • Visual Studio Code 1.102.3
  • Rye 0.44.0(Pythonパッケージ管理ツール)
  • Python 3.11

Marimoをインストール

VS Codeの拡張機能

VS Codeの拡張機能で「marimo」と検索し、インストールする。

image.png

VS Code上で「Ctrl」+「,」から設定を開き、
"Marimo Path"に環境のMarimoのパスを、"Python Path"に環境のPythonのパスを設定する。

image.png

Marimoのpythonパッケージ

MarimoのPythonパッケージを環境にインストールする。
Ryeの場合は以下のようなコマンド。

rye add marimo

Notebookを作成・実行

VS CodeのサイドバーのMarimoを開く。
image.png

NOTEBOOKSから「crate new marimo notebook」を選択し、notebookを作成する。
image.png

コードやテキストを書いて、Jupyter Notebookと同じように実行する。
※コードは勉強がてらにこちらからお借りしたものです。
image.png

良いところ

.py拡張子で保存される

このように.pyで保存されるため、Gitなどテキスト差分管理がしやすい。
image.png

ブラウザからnotebookの作成・編集ができる

起動時にこのようにmarimoが実行される。
(ポートなどは初期設定のまま)
image.png

ブラウザのURLに「localhost:2818」と入れることで、ブラウザからMarimoが表示できる。
image.png

UIを使うことができる

こちらに少しサンプルを載せました。
UIを駆使することで、python実装されたツールをブラウザ利用で提供することができそう。

気になったこと

NOTEBOOKが意図しない場所に作成される

notebookを作成するときに、ワークスペースフォルダの一つ上階層に作成されることがありました。
拡張機能の実装を見ると、ワークスペースフォルダではなく、現在フォーカスされているタブのフォルダパスが採用されるようです。
image.png

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?