programing
-
[WebStorm] tab, indent설정이 제대로 적용되지 않는 경우programing/etc 2019. 5. 19. 17:38
안녕하세요, Einere입니다. (ADblock을 꺼주시면 감사하겠습니다.) 오늘은 WebStorm에서 tab, indent(들여쓰기)설정이 제대로 적용되지 않는 경우 해결하는 방법에 대해 알아보겠습니다. 파일 별 설정 확인하기 File - Settings - Editor - Code Style을 가시면 이렇게 종류별로 indent와 tab size를 조절할 수 있습니다. Indents Dectection 섹션 확인하기 Code Style - General - Indents Detection 섹션을 보시면 "Detect and use existing file indents for editing"옵션이 있습니다. 해당 옵션은 편집중인 파일에 존재하던 들여쓰기를 탐지하고 사용하는 기능입니다. 이 옵션을 꺼주..
-
[WebStorm] Prettier를 사용하여 vue파일 reformat하기programing/etc 2019. 5. 13. 23:46
안녕하세요, Einre입니다. (ADblock을 꺼주시면 감사하겠습니다.) 오늘은 JetBrains의 WebStorm에서, Prettier를 사용하여 vue파일을 reformat하는 방법과, rule을 설정하는 방법에 대해 알아보도록 하겠습니다. WebStorm에서 Prettier plugin 설치하기 우선, Setting - Plugins에서 prettier를 검색하여 설치해줍니다. Prettier의 상세 설명을 보면, 사용 방법이 다음과 같이 나와있습니다. 당신의 프로젝트이 Prettier를 추가해라. Prettier를 이용해 reformat할 코드나 파일을 선택해라. "Reformat with Prettier"액션(ctrl+alt+shift+p)을 사용하거나, "Find Action"팝업에서 찾아서..
-
[Android] background theme를 이용한 splash screenprograming/Mobile 2019. 5. 12. 17:07
안녕하세요, Einere입니다. (ADblock을 꺼주시면 감사하겠습니다.) 오늘은 android에서 background theme를 이용한 로딩 화면(splash screen)을 구현해보록 하겠습니다. splash_background.xml res/drawable/splash_background.xml 위와 같이 코드를 작성합니다. 두번째 item태그의 drawable속성의 속성값을 jpg, png등의 비트맵 파일로 설정하시면 됩니다. 당연히 res/drawable에 해당 파일도 추가해야 합니다. 간혹 의 자식으로 을 사용하는 코드가 있는데, 해당 코드는 ResourceNotFoundException을 발생시키는 경우가 있다고 합니다. 위의 코드대로 하면 해결된다고 하며, 갤s7기준으로 잘 작동하는 것..
-
[부스트 코스] 리뷰어 특강 - 웹 UI개발 2programing/etc 2019. 5. 10. 21:29
웹 UI 개발자 준비 웹 UI 개발 지식 html, css, js algorithm, data structure 포트폴리오 웹 개발 프로젝트 부스트코스 프로젝트 A or B 인턴 입사 후 ... 실무에 도움이 된 인턴 과정 부분 코드 리뷰 질문&답변 실무를 위한 준비 과정 업무 파악 코딩 컨벤션 습득 크로스 브라우징, 웹 접근성 이해 UI 프레임워크 (react, vue)에 필요한 기술 습득 웹 프라우저 및 DOM의 이해 개발 환경 고도화 (sass, gulp) 웹 UI 개발 업무 기획, 디자인 분석 웹 UI 개발 (HTML, CSS, 크로스 브라우징, 웹 접근성) 디자인 검수 (기기 간 UI 확인) 개발 이슈 대응 자가 학습 tip 부스트코스 학습 reference는 MDN 튜토리얼은 w3Schools..
-
[부스트코스] 리뷰어 특강 - 웹 UI 개발 1programing/etc 2019. 5. 10. 20:31
UI : 정보의 성격에 맞게 분류된 화면을 유저가 쉽게 조작할 수 있게 구성한 것. (front-end 소속) 웹 개발 = front-end / back-end 웹의 원리 : 사용 기술 : http, dns, cdn, 로드 밸런싱... 배포 : 서버에 파일들을 작성하여 올린 뒤, 외부에서 요청 가능하게 하는 것. 웹 서비스 개발 프로세스 : 기획 - 설계 - 디자인 - UI개발(front-end, 마크업) - 서버 개발 - QA - 배포 UI 개발 프로세스 : - 마크업 작성 - UI 구현(CSS사용) : - 웹 접근성 고려 - 크로스 브라우징 : 모든 브라우저에서 동등한 정보를 제공하기 위해 UI를 조절하는 것. - CSS3 애니메이션을 사용한 인터랙션 개발 - UI성능 최적화 : 요청 및 용량 최소화..
-
[HTML, JS] ES6문법을 활용한 모듈 export, importprograming/Language 2019. 5. 4. 22:34
안녕하세요, Einere입니다. (ADblock을 꺼주시면 감사하겠습니다.) 오늘은 ES6문법인 import와 export를 사용하여 java script 파일을 모듈화하고 html에서 사용하는 방법을 알아보겠습니다. 모듈화하기 파일 구조는 index.html, portfolio.js, portfolioBuilder.js로 세가지 있습니다. 해당 파일들은 Einere.github.io폴더 내에 존재합니다. portfolioBuilder.js portfolioBuilder.js는 다음과 같습니다. function portfolioBuilder(...) { ... } export {portfolioBuilder}; ES6의 문법중의 하나인, 유명 내보내기(named export)를 사용하도록 하겠습니다. 기..
-
[HTML] a태그를 이용한 문서 위치 이동programing/Web 2019. 5. 1. 21:21
안녕하세요, Einere입니다. (ADblock을 꺼주시면 감사하겠습니다.) 이번 포스트에서는 a태그를 활용하여 문서 내부 이동을 활용해보도록 하겠습니다. 해당 기능은 fragment identifier(#service)의 고유 기능인 앵커(anchor)로 웹페이지 내부에서 이동을 위해 사용합니다. 간혹 SPA에서 라우팅을 위해 해시를 사용하기도 합니다. 특정 id를 가진 엘레먼트 만들기 우선, 특정 id를 가진 엘레먼트를 만들어야 합니다. 특정 id를 가진 엘레먼트 만들기 저는 위의 태그에 "title1"이라는 id를 넣도록 하겠습니다. 테스트를 위해 공백을 채워보겠습니다. . . . . . . . . . . . . . . . . . . . . . 제목으로 그리고 a태그를 이용하여 제목으로 이동하는 링..