見出し画像

WEBサイトで動くアプリを『Create』で作る

WEBサイトで動くアプリを『Create』で作る - つみかさね
https://3yokohama.hatenablog.jp/entry/2024/04/02/194510

『Create』を使って「多言語翻訳システム」を作ってみました。これは「プロンプト」を自然言語で書き込んでCreateボタンを押すと自動的にアプリを作成して写真のようなUIが現れる。Demoボタンを押して、テキスト画面に日本語で文章を入れると、翻訳した英語が出てくる。こんな翻訳システムを簡単に作ってくれる。
このサイトにサインインしてNewpageを作成する。
Create - free-to-use AI app builder
https://www.create.xyz/

プロンプトは下記になります。最初は数行で試し、使ってみて追加で注文を付けたり、削除したりしながら『Create』と対話しながら作っていく。
「Google Translateを組み込んで日本語から英語、英語から日本語を翻訳できる翻訳システムを作成してください。多言語対応にしてください。表示は日本語で、タイトルは「多言語翻訳システム」としてください。自動検出ではなく手動で選択できるようにしてください。翻訳できる言語を増やしてください。韓国語、中国語なども加えて多言語にして下さい。初期設定として出発言語は日本語、目的言語は英語にしてください」
Viewコードとして作成したコードを見ることが出来ます。今回作った「多言語翻訳システム」は下記の言語で作成されています。JavaScript+htmlで構成されています。このコードを実際にWebサイトで動かそうとすると結構難しいです。でもこの『Create』を使うと簡単に作成と実行が出来てしまう。

このコードは、以下の言語を使用しています。
JavaScript: このコードは、ReactというJavaScriptライブラリを使用して書かれています。Reactは、WebアプリケーションのUIを構築するための宣言型ライブラリです。
HTML: このコードは、HTMLを使用して、Webページの構造を定義しています。
CSS: このコードは、CSSを使用して、Webページのスタイルを定義しています。

今のところ自分のメルアドでログインすることが使うことが出来るが、他の人と共有とか公開などをする方法がよくわからない。共有、公開も出来るようなのですが、新しいので説明したHPなど資料が少なすぎるのでよくわからないところがある。そのうちわかりやすいものが出てくるでしょう。


WEBサイトで動くアプリを『Create』で作る
WEBサイトで動くアプリを『Create』で作る
WEBサイトで動くアプリを『Create』で作る
WEBサイトで動くアプリを『Create』で作る
WEBサイトで動くアプリを『Create』で作る

この記事が気に入ったらサポートをしてみませんか?