「Texcrop」の版間の差分

提供: fukudat.net
ナビゲーションに移動検索に移動
 
(同じ利用者による、間の14版が非表示)
1行目: 1行目:
''作りもインフラも古くなってしまったので、β版を https://fukudat.net/texcrop に立ち上げました。しばらくしたら、こっちのバージョンは停止する予定です。'''
+
↓Click↓
 +
<div style="position: relative; width: 240px; height: 36px; overflow: hidden; border: 0px; border: 2px solid lightgray; border-radius: 5px;">
 +
<div style="position: absolute; top: 0px; left: 0px; font-size: 100px; overflow: hidden; line-height: 100px; z-index: 3" >[https://fukudat.net/texcrop &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]</div>
 +
<div style="position: absolute; top: 0px; left: 0px; z-index: 2">[[Image:texcrop-button.png|240px]]</div>
 +
</div>
 +
↑Click↑
  
<div style="position: relative; width: 160px; height: 40px; overflow: hidden; border: 0px; float: left;">
+
TeXCropは「PowerPointでも,標準の数式エディタではなくTeXを用いて数式を書きたい」という変り者(!?)のためのWebアプリ.  
<div style="position: absolute; top: 0px; left: 0px; font-size: 100px; overflow: hidden; line-height: 100px; z-index: 3" >[https://www.fukudat.com/texcrop &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]</div>
 
<div style="position: absolute; top: 0px; left: 0px; z-index: 2">[[Image:texcrop-button.png|160px]]</div>
 
</div>
 
TeXCropは,「PowerPointでも,標準の数式エディタではなくTeXを用いて数式を書きたい」という変り者(!?)のためのWebアプリ.
 
  
 
アップデート版を https://fukudat.net/texcrop に公開。コロナ自粛で暇だったので、少しだけ新しめの技術で再構築してみました。
 
アップデート版を https://fukudat.net/texcrop に公開。コロナ自粛で暇だったので、少しだけ新しめの技術で再構築してみました。
(旧バージョンは  https://www.fukudat.com だが、しばらくしたら消す予定。)
+
https://www.fukudat.com/texcrop でも同じものが稼働中。
  
 
== What's New ==
 
== What's New ==
19行目: 20行目:
  
 
== TO DO ==
 
== TO DO ==
* 日本語フォントのバリエーションを増やす。(無料フォントだとMigMix, 昔はヒラギノ、小塚が使ってたが。)
+
* 日本語フォントのバリエーションを増やす。(無料フォントだとMigMix, 昔はヒラギノ、小塚が使えていたのだが。)
  
 
== どうやって動いているか(備忘録) ==
 
== どうやって動いているか(備忘録) ==
32行目: 33行目:
  
 
[[google:angular+-angularjs|angular]] でWeb UIを記述。後ろのAPIサーバをhttp越しに呼び出す。
 
[[google:angular+-angularjs|angular]] でWeb UIを記述。後ろのAPIサーバをhttp越しに呼び出す。
Web server には[[google:nginx|nginx]]を選択。nginx公式docker imageをベースに、[[google:node|node]] と [[google:angular+-angularjs|ng]] をインストール。
+
Web server には[[google:nginx|nginx]]を選択。nginx公式docker imageをベースに、[[google:node|node]] と [[google:angular+-angularjs|angular/cli]] をインストール。
  
 
=== APIサーバー ===
 
=== APIサーバー ===
  
何がいいのか迷ったが、[[google:gunicorn|gunicorn]], [[google:python+flask|flask]] で RESTful API風に仕立てる。
+
何がいいのか迷ったが、[[google:gunicorn|gunicorn]], [[google:python+flask|flask]] を使用。
 +
 
 
何をベースにコンテナにするか迷ったが、結局、[[google:ubuntu|ubuntu]]のプレインなdocker imageに、[[google:texlive+2020|texlive2020]]、[[google:python|python]]などをインストール。
 
何をベースにコンテナにするか迷ったが、結局、[[google:ubuntu|ubuntu]]のプレインなdocker imageに、[[google:texlive+2020|texlive2020]]、[[google:python|python]]などをインストール。
 
texlive が大きいのでコンテナが大きくなってしまった。使うパッケージを絞れば小さくできるのだが。
 
texlive が大きいのでコンテナが大きくなってしまった。使うパッケージを絞れば小さくできるのだが。
 +
 +
[[Category:How-To]][[Category:fukudat.net]]

2021年11月26日 (金) 19:10時点における最新版

↓Click↓

↑Click↑

TeXCropは「PowerPointでも,標準の数式エディタではなくTeXを用いて数式を書きたい」という変り者(!?)のためのWebアプリ.

アップデート版を https://fukudat.net/texcrop に公開。コロナ自粛で暇だったので、少しだけ新しめの技術で再構築してみました。 https://www.fukudat.com/texcrop でも同じものが稼働中。

What's New

免責

当然のことながら無保証です.

もし問題を発見したらUser:Fukudatにご連絡ください.

TO DO

  • 日本語フォントのバリエーションを増やす。(無料フォントだとMigMix, 昔はヒラギノ、小塚が使えていたのだが。)

どうやって動いているか(備忘録)

内部構造は、

フロントエンド (Web サーバー) →[リバースプロキシ]→ バックエンド (API サーバー) →[exec]→TeXLive2020コマンド類

となっていて、docker-compose で制御されたdockerコンテナ上で動いている。

Webサーバー

angular でWeb UIを記述。後ろのAPIサーバをhttp越しに呼び出す。 Web server にはnginxを選択。nginx公式docker imageをベースに、nodeangular/cli をインストール。

APIサーバー

何がいいのか迷ったが、gunicorn, flask を使用。

何をベースにコンテナにするか迷ったが、結局、ubuntuのプレインなdocker imageに、texlive2020pythonなどをインストール。 texlive が大きいのでコンテナが大きくなってしまった。使うパッケージを絞れば小さくできるのだが。