サルでもわかるWEBプログラミング

フリーソフトのみでホームページ作成

現在位置: index.html » z_blog » 2019 » 190323_elmでbulmaを利用

トレース:

z_blog:2019:190323_elmでbulmaを利用

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

--- z_blog:2019:190323_elmでbulmaを利用 [2019/03/23] – [リンク] adash333
+++ z_blog:2019:190323_elmでbulmaを利用 [2019/04/14] (現在) – [ソースコードその他] adash333
@@ 行 5: / 行 5: @@
 やってみたいと思います。
+===== 開発環境 =====
+参考：http://i-doctor.sakura.ne.jp/font/?p=36967
+Windows 10 Pro
+Chrome
+VisualStudioCode 1.32.3
+git version 2.20.1.windows.1
+nvm 1.1.7
+node 10.2.0
+npm 6.4.1
+elm 0.19.0
+elm-format 0.8.1
+VisualStudioCodeの拡張機能でelmをインストールして、settings.jsonに以下のようにelmを設定
+<code>
+    "[elm]": {
+        "editor.formatOnSave": true
+    },
+</code>
+create-elm-app 3.0.6
+VisualStudioCodeで、Alt+Shift+F, Ctrl+S を繰り返しながらコーディングをしていきます。
+===== public/index.html =====
+public/index.htmlの<head></head>内に、bulmaとFontAwesome5のCDNを記載して、使用できるようにします。
+<code>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css">
+<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
+</code>
+===== src/Main.elm =====
+<html>
+<script src="https://gist.github.com/adash333/6d2e1cb2df25b96f4ff55022f3dd63ca.js"></script>
+</html>
+{{:z_blog:2019:pasted:20190414-174324.png}}
 ===== ソースコードその他 =====
@@ 行 12: / 行 49: @@
 https://package.elm-lang.org/packages/surprisetalk/elm-bulma/latest/
-→ここパッケージを使ってみる？

z_blog/2019/190323_elmでbulmaを利用.1553343679.txt.gz · 最終更新: 2019/03/23 by adash333