Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
12
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

@tan5o

月の絵文字で文字が書けるWebアプリ「月文字ジェネレータ」を作ってみた🌝

できたWebアプリ

bandicam 2018-10-21 23-43-58-526.jpg

月文字ジェネレータ

例えばこんなかんじのアスキーアートがすぐ作れちゃいます。
🌑🌑🌑🌑🌑🌑🌑🌑🌑🌑🌑🌑🌑
🌑🌑🌕🌘🌕🌕🌕🌕🌘🌑🌒🌕🌑
🌑🌒🌕🌓🌕🌕🌕🌕🌒🌕🌒🌕🌑
🌑🌓🌕🌑🌓🌖🌑🌑🌒🌕🌒🌕🌑
🌑🌔🌖🌑🌔🌕🌕🌕🌒🌕🌒🌕🌑
🌒🌕🌖🌒🌕🌘🌒🌕🌒🌕🌒🌕🌑
🌓🌕🌖🌓🌕🌘🌒🌕🌒🌕🌒🌕🌑
🌓🌕🌖🌕🌕🌕🌕🌖🌒🌕🌒🌕🌑
🌑🌔🌖🌑🌑🌒🌕🌗🌒🌕🌒🌕🌑
🌑🌔🌖🌑🌑🌓🌕🌑🌒🌕🌒🌕🌑
🌑🌔🌖🌑🌒🌕🌘🌑🌑🌑🌒🌕🌑
🌑🌔🌖🌒🌕🌗🌑🌑🌑🌔🌕🌕🌑
🌑🌓🌗🌑🌑🌑🌑🌑🌑🌑🌑🌑🌑
「例」という文字をジェネレートしてみました。
文字のサイズや、横幅の文字等を調節できるようにもしてみました。

なぜこれをしようと思ったか

Youtubeのコメント欄で、月の絵文字で文字のアスキーアートを作成したコメントを発見。
wataoka氏の記事 月で絵を描きたいだと?それならpythonに任せなさい🌝を思い出す。
→あれ?もしかして、そんなWebアプリあったかな?と検索
→無かった
→手作業でアスキーアートを作るのすごい!!!と同時に

→自動化したい!!!!!

と思い書いてみました。

技術的バックグラウンド

wataoka氏が超絶技工にアスキーアートに変換するエンジンを書いていただいていたので特に特筆すべき点はありませんが、いい感じに画像で解説したいと思います。

エンジンについてはこちら:月で絵を描きたいだと?それならpythonに任せなさい🌝


bandicam 2018-10-21 23-28-08-200.jpg

入力された文字からPython Image LibraryことPILを使い文字画像を生成して、wataoka氏のAA変換エンジンに読み込ませてあげると、文字 → 月のAA に変換する事ができます。


bandicam 2018-10-21 23-34-15-461.jpg
さきほどのPythonをFlask+BootstrapでWebアプリ化したあとに、お手軽webサーバことPaasのherokuにデプロイしてあげます。
flaskとheroku
シンプルすぎて最高。


bandicam 2018-10-21 23-39-52-182.jpg
今回はドメイン取得+SSL化をしてみます。
お名前.comで1kお布施し、cloudflareを用いてSSL化してみました。

概念図はイマイチCloudFlareの役割がわからないので、やっつけです。間違ってたら教えてください。m(_ _)m

参考:【完全無料】Herokuで独自ドメイン + HTTPSに対応する【Rails】

さいごに

月がきれいですね。。。

さいごまで見てくださりありがとうございます!

バックグラウンドを見て頂くとわかるように、このwebアプリはwataoka氏の記事 月で絵を描きたいだと?それならpythonに任せなさい🌝のおかげで書けたようなものなので、wataoka氏に感謝。。。

月文字ジェネレータ

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
12
Help us understand the problem. What are the problem?