Semantic UI を使ってみた話 / 学生LT in 名古屋 2018

Ba679b0ea7dd7f09ee8975848ce9cb23?s=47 Siketyan
September 16, 2018
Programming
1
240

Semantic UI を使ってみた話 / 学生LT in 名古屋 2018

Ba679b0ea7dd7f09ee8975848ce9cb23?s=128

Siketyan

September 16, 2018
Tweet

More Decks by Siketyan

See All by Siketyan
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
1
180
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
1
160
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
0
39
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
0
88
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
0
58
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
0
68
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
2
240
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
0
45
Ba679b0ea7dd7f09ee8975848ce9cb23?s=48 siketyan
0
150

Other Decks in Programming

See All in Programming
826c34bb94d4fe786230bd95c5bdc409?s=48 fornewid
1
290
80a3a3857a55f154d23acb705eff72cc?s=48 star_zero
3
140
A6a5e01b331d18dbd9c5de1f2cc2879f?s=48 erukiti
2
340
8f1fde48dea93c5c3dd6c68c8b8cee92?s=48 kazutaka333
0
260
0aa238a274c2397214b20d6eed58939b?s=48 moomooya
0
310
D9e4d5a4b36f83fbde1076815df1362f?s=48 bmack
0
380
354271902cd8ba2762d05b251dfa0f84?s=48 pluu
0
280
D360f2c7f29fa7e28e3e648031fbe2f3?s=48 kajyuuen
0
110
70b07e6b7fe7d921d7ac542d0ccb3b2c?s=48 kdmsnr
6
3k
4131d2f57a0db2a2b4d9a62bd389fd44?s=48 tarcieri
0
260
252e6c31a6452aa80deb9ad0107975c7?s=48 attakei
0
200
98ac184c3c4fc1c046fe1f3c669a6746?s=48 y7g
1
190

Featured

See All Featured
C9b18d9dff88a9dd2393364c2b3b21bd?s=48 colly
183
14k
Ecdea9b9714877b86cee08458f085481?s=48 trallard
6
250
7edec06b5435e0dac07a353b2cc26253?s=48 geeforr
330
29k
D36d2c1821af9249b69ff7f5ed60529b?s=48 tammielis
236
23k
E837d2996f52008ace055a08fbfff992?s=48 frogandcode
121
20k
A9179349dd2bdc67f377719f56d85656?s=48 garrettdimon
283
110k
3d6ace9554821d552146413bcdf874f6?s=48 trishagee
6
430
06f8b41980eb4c577fa40c41d5030c19?s=48 keathley
12
440
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
681
180k
C0b42577cfc2b321be3474618107e933?s=48 samanthasiow
51
5.9k
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
775
240k
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
407
57k

Transcript

  1. Semantic UI を使ってみた話 Web UI フレームワーク Siketyan

  2. ぼく「プロコンでフロントエンド 担当になったけど、CSS一から 書くのはめんどいな」

  3. そうだ、Bootstrap使おう

  4. Bootstrap とは • Webサイトでよく使われるコンポーネントがあらかじめ定義され たCSS, JSフレームワーク • グリッドによるレスポンシブ制御 • ボタンとか、ナビゲーションとか

    https://getbootstrap.com/

  5. こういうの （これはv3なのでちょっと古い）

  6. ダサくない？

  7. じゃあ、Semantic UI を使おう

  8. Semantic UI とは • Bootstrapとだいたい同じ https://semantic-ui.com/

  9. こういうの

  10. Semantic UI

  11. 良いところ

  12. かゆいところに手が届く

  13. 例えばローダーとか • 外部ライブラリを読み込まなくても使える • Bootstrapにはない • 画面全体を覆ってとかも簡単

  14. 悪いところ

  15. レスポンシブ制御がちょっとめんどい • Bootstrapのようなカラムを改行するという考えが少し薄い • できなくはないが、どの幅で改行させるかの指定が難しい

  16. 質疑応答

  17. ありがとうございました