common.title

Docs
Quantum Circuit
TYTAN CLOUD

QUANTUM GAMING


Overview
Contact
Event
Project
Research

Terms of service (Web service)

Terms of service (Quantum and ML Cloud service)

Privacy policy


Sign in
Sign up
common.title

量子コンピュータアプリの作り方(Python+Javascript編)

Yuichiro Minato

2022/09/13 00:03

量子コンピュータのアプリを作り始めましたが、作り方がわからないという方が多いので、書きます。

1.必要なツールはpythonとjavascript

基本的にはPythonを使ってサーバー側のアプリを書きます。弊社はblueqatを提供していますので、blueqatを使ってもらいたいです。おすすめは環境を構築するにあたってvirtualenvを導入し、最初に環境を整えます。$ source virt/bin/activate をすることで環境に入ることができ、そこからpip3 install hogehogeでツールをインストールします。ツールをインストールし終わったら最後はpip3 freeze > requirements.txtに書き出しておきましょう。

ライブラリとして必要なのはflaskになります。これを使うことで簡単にアプリを作れます。flaskはapp.pyもしくはapplication.pyというファイルを用意し、その中にウェブアプリを書いていきます。この中にはデータのやり取りやURLでのやり取りのみを書きます。そして、templatesというフォルダを作って、そちらにテンプレートとなるhtmlファイルを置いておきます。このhtmlファイルにはJavascriptを導入することでより挙動が豊かなアプリを作ることができます。

2.Pythonだけでつくるとき

量子計算や機械学習を行っている人はフロントエンドのJavascript/htmlが苦手という人が結構います。そういう時はぎりぎりJavascriptを使いたくないときは、GET/POSTのリクエストだけでページ遷移を構成してページを渡ってデータを持ちまわれます。html側にはformを使ってinput要素とsubmitボタンを配置し、formに遷移先のページを記述します。Python側ではflaskが良しなにやってくれますので、GET/POSTを指定して受け取るデータを記述して処理をします。これによってフロント側はページを遷移しながら処理を行い、動作を作ることができます。同じページを指定して投げるデータによって見栄えを変えるなどもできます。

3.よりリッチにつくりたい

Javascriptを導入してajax経由でデータを送信します。慣れてない人はjqueryなどを使えばより簡単にデータを処理できます。その場合は画面を移動しなくても、ボタンを押したときに特定のURLにデータを投げるなどの処理を行うことができます。その場合は単一のページから複数回データを送信したり受け取ったら動的にページを書き換えたりなどの処理を行うことができます。認証などはフロント側に処理を渡す場合には多少煩雑になることもあります。FastAPIなどのPython側をAPIだけにするということもあります。

4.CSSフレームワークを活用する

多分苦手な人はデザインやボタン配置やレイアウトなどが大変かと思います。現在はそのようなものはCSSのフレームワークが発達しているため、レイアウトの最低限の書き方のルールを覚えれば簡単にできます。twitter boostrapをはじめとして自分の使いやすいcssフレームワークでgridの使い方、ボタンやフォームの配置の仕方をコピペから学んでいけばすぐに覚えることができます。

現状量子コンピュータのアプリはバックエンドのサーバーサイドにすべてPythonのコードを記述して、どのようにフロントに表示させるかしかありません。今のうちに基礎を学んでアプリを作って少しずつ広げていきましょう。

GUIはコミュニケーション、人生にとって必要な作業。GUIが苦手な人はコミュニケーションが苦手な人が多いと思います。インターフェイスは人との会話やコミュニケーションで使用感が変わってきますので、バックエンドのモデルだけでなくフロントエンドも意識的に取り掛かることでビジネスが広がります。以上。

© 2025, blueqat Inc. All rights reserved