시멘틱UI 공부하기 - 아임웹 전문가찾기

이온디 블로그

글 등록하기 | 내글 관리하기 | 연재글 | 보관함

시멘틱UI 공부하기

2019.04.07 01:51 조회 수

203

이온디

첨부파일 https://imweb.eond.com/blog/417745

시멘틱UI를 이용해서 레이아웃 만드는게 목표입니다.

지금 몇 주째 제대로 공부를 안하고 있네요 ㅠㅠ/

공부시도기는 계속 적어보겠습니다. ㅠㅠ

1. Sementic UI 쉽게 시작하기

간단하게 코드펜에서 시작하세요!

샘플예제

https://codepen.io/ketanonline/pen/zMjMmJ

CSS

https://cdn.jsdelivr.net/npm/semantic-ui@2.1.8/dist/semantic.min.css

https://code.jquery.com/jquery-2.2.0.min.js

https://cdn.jsdelivr.net/npm/semantic-ui@2.1.8/dist/semantic.min.js

https://codepen.io/ketanonline/pen/zMjMmJ

https://code.jquery.com/jquery-2.2.0.min.js

2019년 4월 14일

1) 윈도우에서 bash 사용하기

https://blogs.msdn.microsoft.com/eva/?p=7633

2) cmder 설치하기

https://busy.org/@paul9/conemu-cmder

https://cmder.net/

3) cmder에서 semantic-ui 설치하기

a. 환경

Windows10

node -v : v10.15.3

npm -v : 6.4.1

b. 오류

Creating src/theme.config (LESS config) d:\........

c. 알려진 문제

https://github.com/Semantic-Org/Semantic-UI/issues/6641

4) nodejs 제거 후 재설치

https://exhesham.com/2017/12/01/how-to-downgrade-nodejs-and-npm-on-windows/

https://nodejs.org/dist/v10.1.0/

node-v10.1.0-x64.msi 를 찾아서 다운로드 후 윈도우에 설치함.

5) npm instal semantic-ui --save 성공

6) gulp build 성공

7) gulp 명령어

https://semantic-ui.com/introduction/build-tools.html

gulp 알아보기

https://code.tutsplus.com/ko/tutorials/managing-your-build-tasks-with-gulpjs--net-36910

gulp install : sematic.json 설치 질의

gulp watch : 기본값

gulp build : Build all files (dist 폴더에 semantic.css 등을 생성함)

gulp clean : dist 폴더를 삭제함

gulp version : dist 폴더에 생성한 semantic-ui 버전 확인

gulp build-javascript

gulp build-css

gulp build-assets

gulp serve-docs

gulp build-docs

8) theme 변경

https://semantic-ui.com/usage/theming.html

첨부파일

Total 176 articles in 3 / 12 pages

	제목	날짜
146	[웹] #SCSS + sourcemap 작성하는 이유	2019/04/09
145	[웹] phpstorm scss 동작 안됨!! ㅠㅠ	2019/04/08
144	[웹] XE3 설치	2019/04/07
143	[웹] Autoset10.7.2 설치	2019/04/07
142	[웹] AdobeXD 실행 안됨	2019/04/07
141	[기획제작기] 만들어보고싶은 레이아웃2019	2019/04/07
140	[웹] 온라인 에디터	2019/04/07
139	[하드웨어/OS] 결국 윈도우 새로 초기화 ㅠ_ㅠ	2019/04/07
	[웹] 시멘틱UI 공부하기	2019/04/07
137	[하드웨어/OS] 윈도우10 계속된 윈도우 업데이터 오류	2019/04/07
136	[레이아웃제작기] MyNote 1.5. CSS arrange	2019/04/05
135	[레이아웃제작기] 윈도우 도커 [1]	2019/04/05
134	[기획제작기] 201901 우리아이(WOORIAI)	2019/04/05
133	[운영] 책방아이 미팅	2019/04/05
132	[모듈스킨작업기] 지역검색게시판 - 지도생성	2019/04/04