분류 전체보기 145

VSC 단축키 변경 (블럭 주석처리 단축키)

VSC 주석처리를 하는 단축키로 한 줄 주석을 처리할 때 ( // )는 Ctrl + / 블럭 주석으로 처리할 때 ( // 가 여러 줄에 하나씩 적용하여 개별 주석처리)는 Ctrl+k+c 또는 Ctrl+k+u 전체 블럭 처리를 하여 주석으로 처리할 땐 ( /**/ 로 모든 줄을 하나의 주석으로 처리) Shift + Alt + a이다 나는 주로 한 줄 주석처리 // 또는 /**/ 형태의 블럭 주석처리를 자주 사용하는데 단축키에 통일감이 1도 없어서 좀 더 편리하게 사용하고자 /**/ 블럭 주석처리의 단축키를 변경하였다 ( Cmd + Shift + / 로 바꾸고 싶었다 ) 우선 VSC 실행 후, 하단의 톱니바퀴 모양을 클릭하여 Shortcuts 단축키 설정 탭을 클릭한다 클릭하면 이렇게나 많은 VSC 단축키 ..

카테고리 없음 2021.08.03

UI&UX란?

프론트엔드에 관심을 갖고 공부를 하면서, UI와 UX에 대한 개념과 중요성을 알게 되었다 아마 프론트엔드 채용공고를 보면 'UI&UX에 대한 이해도와 관심'에 대해 기재해놓은 곳이 있을 것이다. 당연히 화면단을 구성함으로써 디자이너들과의 협업이 필수이며 우리가 만드는 웹은 결국 사용자들이 사용하기 때문에 사용자를 이해하는 것이 매우 중요하다. 즉 사용자들이 보기 편하고 조작이 쉬운 인터페이스를 설계해서 계속하여 만족스러운 서비스를 이용하게끔 유도해야 하는데, 이것이 바로 UI UX를 우리가 이해하고 계속해서 고려해야 하는 이유가 된다. UI User Interface의 약자로, 사용자 인터페이스를 뜻한다. 사용자들이 가장 처음에 마주하는 것이 이용하는 서비스 화면의 디자인인데, 이를 디자인하는 것이 UI..

Etc. 2021.08.02

CSS 단위 em, rem, vh vw, %, px 정리

폰트 및 컨테이너 크기를 지정할 때 사용하는 단위는 여러 가지가 있는데,정적인 부분은 px, 동적인 부분은 %, viewport(vh, vw), em, rem이 존재한다 px모니터 위에서 화면을 나타내는 가장 작은 단위이며 반응형으로 사용하기는 힘들어서 정적인 웹페이지에 사용한다.컨테이너 사이즈 변경되어도 콘텐츠의 크기는 변경 없이 그대로 고정되어 있기 때문이다또한 픽셀로 폰트 크기를 변경하는 경우, 브라우저에서 폰트 크기를 변경해도 아무런 반응을 하지 않음 (아예 고정되어있음)이는 웹 접근성이 떨어진다고 볼 수 있다.em같은 폰트사이즈라 하여도, 사용하는 폰트 패밀리에 따라 사용자에게 보이는 크기가 달라질 수 있는데em은 폰트패밀리에 상관없이 항상 고정된 폰트 사이즈를 갖고 있다em은 부모의 폰트 사이..

IT 2021.08.01

InnerHTML & InnerText & TextContent 의 차이

innerHTML display:none으로 지정한 요소, 자식 요소의 element tags, 모든 스페이싱(띄어쓰기), 줄 바꿈이 그대로 출력된다. 세 가지 중에서 가장 추천하지 않는 속성이다 프로퍼티의 값은 text와 html로 파싱 한 결과이며 다른 속성에 비해 상대적으로 파싱이 느리다 하지만 파싱이 느리다는 점 보다 더 큰 문제는 보안 취약성 문제이며, XSS의 취약 사례로 언급이 되기도 했었다. innerText text, plain으로 파싱한 결과이며 element tags 없이 딱 텍스트만 나온다. 만약 여러 번 중복되는 스페이싱이 존재한다면 딱 한 번만 나오며, 줄 바꿈은 따로 적용되지 않는다 innerText는 IE8이하에서 지원되지 않았던 TextContent와 달리 IE엔진에 적합한..

IT 2021.07.31

이클립스 스프링 프레임워크 정리 ⑦

회원 추가 폼 만들기 memberController에 작성 -> views에 insertform.jsp 만들기 그리고 dao는 인터페이스 구현해서 만들기 때문에 메서드 추가할 거면 인터페이스에 추가해줘야 함 memberDaoImpl에서 add unimplements- 클릭 이렇게 작성 후, memberMapper로 이동 위의 내용으로 memberController 수정 ModelAndView : 데이터와 페이지 이동할 포워드의 정보를 담을 수 있다 그리고 alert.jsp 만듦

카테고리 없음 2021.07.30

이클립스 스프링 프레임워크 정리 ⑥

webapp은 클라이언트에게 공개되는 폴더 ->html css js image web-inf는 직접 요청은 불가능하지만 forward 이동으로 jsp 응답 가능 서버 측에서 포워드 이동으로 응답 공개되지 않는 페이지를 run 해버리면 (접근 불가능) 404번 버스 타야 함 bean이 되는 방법은? bean이 되는 방법은 두 가지 존재 위에 꺼가 첫 번째 방법임 xml문서에 직접 bean 설정을 함. 그러면 로딩되는 시점에 알아서 빈 객체 생성해서 스프링에서 관리함 최종적으로 나온 SqlSessionTemplates를 Dao에 넣어줌 DI를 통해! 그리고 이를 통해서 sql update insert 등 작업을 함 @Autowired가 두 개를 대신해줌 (실행 시점에!) 결국 어노테이션은 클래스의 소스코드를..

카테고리 없음 2021.07.29

이클립스 스프링 프레임워크 정리 ⑤

이렇게 3개 추가 memberdao class를 implements 했다는 의미로 Impl 멤버 컨트롤러 생성 의존관계 스프링이 이 클래스를 직접 생성하고 관리하게끔 해야 함 기본 패키지의 하위에 있어서 컴포넌트 스캔함 컴포넌트 스캔을 통해서 빈(객체) 생성 오직 하나만 생성 => 싱글톤 현재 dao는 비어있음. 밑에서 이걸 참조하려고 하면 널포인트익셉션 발생 -> 500번 버스 타야 함.. 그래서 의존 객체 주입 DI 해야 함 dao 객체 참조값이 주입이 됨 DI는 스프링 핵심 개념 1,2는 지켰지만 아직 3은 X memberdaoImpl객체는 memberdao타입이기도 함 인터페이스 타입으로 바꿈 (클래스 임포트 하지 말고) 이렇게 의존관계를 끊어버림 memberdaoImpl클래스 삭제해도 멤버 컨트..

카테고리 없음 2021.07.28

이클립스 스프링 프레임워크 정리 ④

pom.xml 설정 위의 두 개 먼저 바꿔주기 수업에 필요한 라이브러리 미리 추가 그리고 저장하면 라이브러리 알아서 다운로드됨 (조금 기다려야 함) 업데이트 프로젝트 클릭 1.6에서 1.8로 변경되어있음 마이바티스란? DB 연동 시 문서들을 xml로 쉽게 작성할 수 있도록 이렇게 pom.xml에 마이 바티스 준비해놓음 그리고 관련 플러그인 설치 help->이클립스 마켓플레이스 클릭 mybatis 검색해서 두 개 다 설치하기 하나 설치하면 재부팅 나오는데 일단 무시하고 두 번째 거 다 설치 후에 이클립스 재부팅하기 재시작하고 pom.xml 들어가 보면 버전 1.8로 바뀌어있음 그리고 mybatis에 xml문서 추가하기 new->other->xml->xml file 컨트롤 스페이스 하면 configurati..

카테고리 없음 2021.07.27

맥북 이클립스 톰캣서버 보안 에러 ~ use of a secure connection 해결방법

맥북으로 이클립스 설치 및 톰캣 서버 연동하고 Run on Server 클릭하여 실행하려는데 ~ App Transport Security policy requires the use of a secure connection이라는 보안 관련 에러가 발생했다 그리고 톰캣 서버 실행이 되지 않았다 온갖 구글링으로 찾아보는데 다들 ATS 관련 문제라며 ATS를 제외시킬 도메인을 Info.plist에 작성하는 방법을 알려주었다. 사실 이 방법은 내가 해보지 않아서 잘 모르겠지만 다른 해결방법이 있다 나보다 먼저 M1 맥북으로 이클립스 설치하고 온갖 삽질을 해서 해결했던 조장님이 알려주신 방법이다 (참고로 나는 2020 맥북 프로 사용 중인데 M1과 이클립스 설정 방법이 다행히 똑같았다) 진짜 맥북으로 이클립스 설치..

카테고리 없음 2021.07.26

이클립스 스프링 프레임워크 정리 ③

서블릿에서 데이터를 리퀘스트에 담고 jsp로 포워드 이동해서 응답하는 걸 MVC패턴이라 이해하면 됨 디스패처 서블릿을 직접 변경하진 못함. 그래서 서블릿 콘텍스트 xml 파일을 변경 서블릿 콘텍스트 파일로 이동했더니 컨트롤러에서 리턴할 때 앞과 뒤에 붙는 거 설정 클라이언트가 어떤 요청(. do로 끝나는)함. 그럼 디스패처는 이 요청을 처리할 컨트롤러 찾음. 처리하고 xxx.jsp로 포워드 이동함. 그리고 jsp에서 응답 톰캣 웹서버 동작은 web.xml로 세팅 디스패처 서블릿 동작은 servlet-content.xml로 세팅 원래 자르 파일은 직접 다운로드하여서 넣었었음 스프링에서는? 우린 저걸 다운받아서 가져다 놓은 적 없었음 메이븐 프로젝트 특징은 pom.xml 존재 이게 바로 의존 라이브러리. 여..

카테고리 없음 2021.07.25
반응형