Dev 90

C

SCSS

scss만의 문법으로 css보다 편하게 작성 후 css로 컴파일해서 사용한다 # SassMeister sass/scss 문법을 css로 컴파일 해주는 사이트 사용하기 전 이렇게 세팅 # vscode에 scss 컴파일러 설치 node.js 설치 nodejs.org/en/ cmd에서 npm init -y 를 입력하면 setting.json 파일이 생긴다. vscode터미널에서 해당 프로젝트로 경로를 맞추고 npm install --save-dev parcel-bundler npm i -D parcel-bundler (위와 같음) scss 파일을 레퍼런스하는 index.html 문서를 작성한 뒤 //이게 들어가면 된다. 터미널을 열고 index.html이 위치하는 경로에서 npx parcel index.htm..

Dev/HTML \ CSS \ JS 2021.01.21

C

[ DEV Ed ] glass webpage 중간중간 메모

# www.youtube.com/watch?v=O7WbVj5apxU&t=568s ## CSS # 우측 위를 향하는 배경 그라데이션 background: linear-gradient(to right top, #65dfc9, #6cddeb); # div 중앙에 띄우기 display: flex; align-items: center; //가로 justify-content: center; //세로 # rgba 투명도까지 처리할수 있는 색상 코드 rgba(255, 255, 255, 0.7) # 모서리 둥글게 border-radius: 2rem; # 완전히 둥글게 border-radius: 50%; # 블러 처리 backdrop-filter: blur(2rem); # 가로로 놓기 display: flex; # 가로로..

Dev/HTML \ CSS \ JS 2021.01.21

C

CSS 단위 [rem / em / vh / vw / vmax / vmin]

# CSS 단위 em 부모 태그의 사이즈를 기준으로 잡는 단위 만약 가장 최상위의 글자 크기가 10px이고 하위 태그의 글자 크기가 1.2em이면 하위 태그의 글자는 12px가 된다. 또 그 하위 태그는 14.4px가 된다. See the Pen zYKXqjN by Soksurim (@soksurim) on CodePen. rem 최상위 태그의 사이즈를 기준으로 잡는 단위 See the Pen MWjRyBy by Soksurim (@soksurim) on CodePen. vh & vw (vertical height & vertical width) 뷰포트의 너비값과 높이값에 맞춰 사이즈를 조절한다. vh는 뷰포트의 높이의 1/100단위이다. 브라우저 높이값이 900px일때 1vh는 9px이 된다. See ..

Dev/HTML \ CSS \ JS 2021.01.21

C

인텔리제이 단축키 및 플러그인 메모

Ctrl + Shift + A 액션 검색으로 Keymap Reference를 열면 다음과 같은 pdf가 열린다. 검색기능 Ctrl + N : Class(Object) 검색 Shift+Ctrl+N : 파일검색 Shift+Ctrl+Alt+N : 심볼 검색 (메소드, 변수 검색) ★ shift 더블탭 : 위의 모든 항목 통합 검색 ★ shift+Ctrl+A : 인텔리제이의 모든 액션 검색 북마크 기능 F11 : 토글 북마크 Ctrl + Shift + 1 ~ 9 : 해당 위치 북마크 설정 Ctrl + 1 ~ 9 : 해당 북마크 번호로 이동 Alt + 2 : 북마크 바 ★ Alt + Insert : Project 탭에서 New.. Ctrl + F12 : 파일 내부구조 디스플레이 Ctrl + o : override..

Dev/IntelliJ 2021.01.18

C

스프링 MVC with @Annotation

★ Setter에 @Autowired 1. ~ context.xml의 Namespaces 탭에서 context 체크 2. bean의 property설정을 지우고 자바파일의 세터 메소드에 @Autowired 걸기 ## servlet-context.xml ## ListController.java private NoticeService noticeService; @Autowired public void setNoticeService(NoticeService noticeService) { this.noticeService = noticeService; } 3. 걸기 ## servlet-context.xml # @Autowired를 생성할 클래스에 직접 걸 경우 setter는 생략 가능하다. @Autowired ..

Dev/Spring 2021.01.14

C

DOM 메모

# document의 태그 띄우기 // log.js function log(msg) { var console = document.getElementById("debugConsole"); if (console != null) { console.innerHTML += msg +" "; } } a test b p c LastChild와 LastElemenChild의 경우 브라우저 버전에 따라 제대로 나오지 않는 경우가 있다. # 짝퉁 TO DO LIST (새로고침시 초기화) ## books.jsp ## JAVA 프로그래밍 코난 JSP 웹 프로그램 홍길동 SPRING Framework 또치 파일로부터 책 정보를 읽어와 출력

Dev/HTML \ CSS \ JS 2021.01.13

C

스프링 MVC 기본구조 정리

Client가 index 페이지에 해당하는 url(http://아이피:포트/프로젝트명/aa/index)을 호출하면 1. DispatherServlet 먼저 DispatcherServlet과 HandlerMapping을 거쳐 해당 url과 Mapping이 되는 bean(IndexController)을 호출한다. 2. Controller 컨트롤러가 호출되면 ModelAndView 객체를 생성해 DispatcherServlet으로 보낼 Model과 View이름을 담는다. Model - 페이지에 띄울 데이터 View - 페이지 주소 설정을 완료하고 출력시키면, Client에 의해 /aa/index 라는 url이 호출되면 DispatcherServlet과 HandlerMapper를 통해 Controller가 호출..

Dev/Spring 2021.01.10