selection CS

원래 MUI를 작은 프로젝트로 적용해 본 적이 있었는데, 이번에 Chakra UI라는 것을 듣게 되어, 현재 하고 있는 프로덕트에 적용해보려고 한다. (docs만 읽어봤을 때 꽤나 괜찮아 보였다.) Chakra UI 'Ease of Modification' Chakra makes it easier to customize components to be entirely your own - 컴포넌트 커스텀을 보다 더 쉽게 제공한다. Material UI vs Chakra UI Material UI 반응형 스타일들을 제어하기 위해서 별도의 코드가 필요하다. 만약 사용자가 css를 커스텀을 하려면 별도의 코드가 비교적 많이 추가된다. : 즉, 커스터마이징이 적을수록 사용하는 것이 좋다. Chakra UI 기본적으..

갑자기 디버깅을 하려고 하는데 어제 부터 이 오류로 실행이 되지 않아서 작업을 하지 못했다. 구글 선생님에게 수차례 여쭈어 본 결과 여러 문서들이 많이 나왔는데, 대부분 Build Setting에 SDK를 arm64로 맞춰줘야 한다.. 빌드 내역을 삭제해야한다는 내용의 글들이었고, 다 따라해봤는데 해결하지 못했다. 꼬박 3일째 고민하다가 나 혼자만의 해결법을 찾았다. (3일내내 고민한 것 치고는 해결법이 매우 간단하다.) 내 상황은 시뮬레이터 상황에서만 실행이 되지 않았고, 실제 기기에서는 잘 작동하는 문제였다. 조사해보니 ios 시뮬레이터는 x86_64이고, 실제 기기는 arm64위에서 돌아간다. 그러다 보니 실 기기로 주로 디버깅을 돌렸다가 한번 시뮬레이터로 작동시켜보려고 하니 생긴 문제인 것 같다고..

새로 맡은 업무로 새롭게 php에 대해서 공부를 해야하기 때문에 알아보는 도 중, 웹 구현에서 자주쓰는 sublimetext로 php개발을 좀 많이 하는 것 같았다. 그래서 나도 sublimetext로,, 진행!! 1. bitnami 설치하기 먼저 나는 bitnami라는 걸 먼저 설치하였다. (xampp 라는 것도 있었는데, 전에 한 번 해봤기 때문에 이번엔 bitnami!) 설치하는 과정은 다 똑같기 때문에 언급은 안하겠다. 여기중에 'Open Application Folder'를 클릭해준다. 그럼 폴더 경로가 나오게 되는데 좀 한 폴더에 작업한 것을 모아두고 싶어서 'workspace' 라고 지정해 두었다. (이 workspace에서 sublimetext가 작업할 것이다.) 2. sublimetext..

1. Bootstrap다운 getbootstrap.com/docs/3.4/getting-started/#download Getting started · Bootstrap getbootstrap.com Download Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more. getbootstrap.com * 3.4.1ver의 bootstrap을 설치함 설치 후, 압축 해제를 하고 css, js, font를 다음과 같이 붙여넣기함 "login.jsp" 다음과 같이 meta태그에 설정해주면 반응형 ..

이 게시물은 동빈나 JSP게시판 만들기 강좌를 들으며 작성한 게시물입니다. 환경 셋팅 1. eclipse EE 설치 JDK와 eclipse installer 다운로드 후 다음과 같은 설정을 셋팅해준다. eclipse installer -> Eclipse IDE for Enterprise Java Developers JSP는 동적 웹 프로젝트 New Project -> Dynamic Web Project 2. tomcat 8 설치 tomcat.apache.org/download-80.cgi Apache Tomcat® - Apache Tomcat 8 Software Downloads Welcome to the Apache Tomcat® 8.x software download page. This page pr..

이 게시물은 naver boostcourse와 패스트캠퍼스의 강의를 시청한 후 정리한 글입니다. Build Tool - Maven - Gradle Survlet Containers - Tomcat - Jetty - Undertow - Netty 어플리케이션 개발에 필수 요소만 모아둠 기존 Spring보다 간단하게 설정가능, 간단한 어플리케이션 개발 가능 간단하고, 빠르게 어플리케이션을 실행 및 배포가 가능하다. Spring에서 불편한 설정이 없어졌다. 1. Intelli J 설치 (http://jetbrains.com/idea/download/#section=windows) Download IntelliJ IDEA: The Capable & Ergonomic Java IDE by JetBrains Dow..

CSS Selector : HMTL요소를 tag, id, class, html 태그 속성을 이용하여 엘리먼트를 쉽고 빠르게 찾을 수 있다. style을 지정하기 위한 3가지 선택자 tag로 지정하기 id로 지정하기 HELLO World! class로 지정하기 HELLO World! CSS Selector의 다양한 활용 id, class 함께 사용 #myid{color : red} div.myclassname{color : red} 그룹 선택 h1, span, div{color : red} h1, span, div#id {color : red} h1.span, div.slassname { color : red} 요소 선택(공백) : 자손요소 , 아래 모든 span태그에 red색상이 적용됨 span tag ..

CSS는 작성한 html을 좀더 이쁘게 만들어주는 기능을 한다. 기본적인 구성은 다음과 같다. span { color : red; } 기본적으로 span : selector, color : property, red : value 으로 이루어진다. ? CSS style을 HTML에 적용하는 방법 inline (html 태그 안에다 적용) internal (style 태그로 지정하여 css파일을 따로 관리 하지 않아도 된다. ) ... external (css파일을 따로 분리하여 작성하고 링크를 걸어주어 사용한다.) 상속과 우선순위 결정 refer : www.boostcourse.org/web316/lecture/254261/?isDesc=false 웹 프로그래밍(풀스택) 부스트코스 무료 강의 www.boo..

이 포스트는 boostcourse에서 공부하며 기록하였습니다. HTML 태그 상세 내용 : w3schools.com Layout tags 종류 header section nav footer aside 레이아웃 실습 Standard HTML5 Semantic Layout (github.com) Standard HTML5 Semantic Layout Standard HTML5 Semantic Layout. GitHub Gist: instantly share code, notes, and snippets. gist.github.com

이 포스트는 boostcourse에서 공부하며 기록하였습니다. chrome 브라우저를 다운로드하여 ctrl + shift + i를 치면 console창이 뜨면서 기본적인 html의 구성을 알 수 있다. html은 계층적 구조이다. 태그를 이용하여 작성이 된다. html, head, body가 있다. HTML문서에는 HTML, CSS, Javascript로 구성되어있다. Meta 태그 : 브라우저에게 정보를 제공하는 기능을 한다. viewport : 페이지가 모든 기기에 맞춰 조정된다는 것을 브라우저에게 알리는 태그이다. (반응형 웹) reference : viewport meta 태그를 이용해 모바일 브라우저상에서 레이아웃 조종하는 법 - Mozilla | MDN viewport meta 태그를 이용해 ..