쉽게 쉽게

▤ 목차Sources 메뉴에서는 중단점(Breakpoint)을 활용하여 디버깅을 할 수 있다.즉 ​ 중단점(Breakpoint)을 활용하면 실행 단계마다 스크립트의 동작을 잠시 멈추고 발생하는 이슈를 확인할 수 있다.이에 대해 자세히 알아보려고 한다.1. 중단점(Breakpoint) 사용법1. Sources 메뉴 구조Sources 패널은 크게 세 개의 영역으로 구성된다.파일 탐색 영역 : 페이지를 구성하는 모든 리소스(HTML, JavaScript, CSS 등)를 트리 형태로 보여준다.코드 에디터 영역 : 선택한 파일의 소스 코드를 보여주며 편집도 가능하다.자바스크립트 디버깅 영역 : 디버깅에 관련된 기능을 제공한다.2. 중단점 설정코드 에디터 영역에서 디버깅하길 원하는 라인을 클릭하면 파란색으로 선..

▤ 목차개발 시 크롬 개발자 도구에서 설정할 수 유용한 기능들과 Sources - Console - Elements - Application - Lighthouse - Performance - Memory - Network 패널 기능들을 정리해보려고 한다.1. 크롬 개발자 도구 설정다양한 패널 기능들을 사용하기 전에 개발자 도구에서 세팅할 수 있는 유용한 기능들을 알아보려고 한다.개발 시 알아두면 편리한 기능들 위주로 정리해 봤다.1. 창모드 선택 우측 버튼을 클릭하여 개발자 도구 위치를 지정할 수 있다. Dockside 순서대로 창모드, 왼쪽에 배치, 아래 배치, 오른쪽 배치이다.2. 디바이스 모드 선택디바이스 모드는 모바일 브라우저 개발을 지원하는 기능으로 다양한 기기를 테스트 해볼 수 있다...

▤ 목차1. MVC 패턴이란?MVC 패턴은 웹 개발에서 널리 사용되는 강력한 설계 패턴 중 하나로, 사용자 인터페이스와 비즈니스 로직을 분리하여 애플리케이션의 구조를 개선하는 디자인 패턴이다. 애플리케이션의 개발 영역을 MVC(Model, View, Controller)로 구분하여 각 역할에 맞게 개발하는 방식이다.따라서 MVC 패턴을 도입하면 UI 영역과 도메인(비즈니스 로직) 영역이 구분되어 서로에게 영향을 주지 않으면서 개발과 유지보수가 가능하다. 즉 MVC 패턴의 장점은 아래와 같다. 각 컴포넌트가 서로 분리되어 개발 과정을 체계화하고 시스템 결합도를 낮출 수 있다. 컴포넌트의 변경이 다른 컴포넌트에 영향을 미치지 않아 유지보수가 쉬우며 중복코드를 제거할 수 있고, 애플리케이션의 확장성 및 유연성..

▤ 목차스프링 시큐리티를 통해 로그인을 성공 후 로그인 정보를 가져오는 방법에 대해 공부하고자 했다.1. 로그인 정보 사용법 로그인 정보를 사용하는 방법은 두 가지 정도로 생각했다.공통적으로 사용하는 Util 클래스에 static 메서드로 정의하기(공통 메서드처럼)@ControllerAdvice를 사용하여 전역컨트롤러에서 정의하기전자의 경우는 아래처럼 정의하여 각 컨트롤러에서 사용하면 된다.public class LoginUtility { /** * 스프링 시큐리티 접속 정보 가져오기 */ public static customUser getCustomUser(){ //스프링 시큐리티 컨텍스트로 부터 가져오기 if(SecurityContextHolder.getContext() != null && S..

▤ 목차1. 이슈MariaDB에서 이모지를 저장할 때, Incorrect string value 에러가 나타났다.해당 원인을 분석해보니 MariaDB에 설정된 charset은 UTF8이 해당 이모지를 지원하지 않았기 때문이다.UTF-8은 최대 3바이트 지원하지만 이모지는 4바이트가 필요하기 때문에 이를 저장하기 위해서는 utf8mb4 캐릭터셋을 사용해야 했다.따라서 UTF-8을 utf8mb4로 변경하는 과정이 필요했다.2. 캐릭터셋(charset) 변경 1. 캐릭터셋과 정렬방식 확인SELECT default_character_set_name, DEFAULT_COLLATION_NAME FROM information_schema.SCHEMATA WHERE schema_name = '테이블명';SHOW VAR..

▤ 목차1. 정규표현식(Regular Expression) 1. 정규표현식이란?정규표현식(Regular Expression)이란 문자열 데이터 중에서 원하는 조건(패턴)과 일치하는 문자열 부분을 찾아내기 위해 사용하는 것으로, 미리 정의된 기호와 문자를 이용해서 작성한 문자열을 말한다.자바에서는 replaceAll(), split() 메서드, Pattern 클래스의 matches() 메서드를 사용하여 문자열 검증 및 치환할 수 있다.(ex. 전화번호, 주민등록번호, 이메일 등 형식체크, 특수문자 치환 및 제거) 2. 정규식 기호 사용법 1. 정규식 일반 기호기호의미예시^문자열 시작을 의미대괄호([ ]) 밖에 ^가 쓰이면 시작의 뜻 대괄호([ ]) 안에 ^가 쓰이면 제외의 뜻^s : s로 시작하는 단어[^..

▤ 목차1. 문제설명https://school.programmers.co.kr/learn/courses/30/lessons/250137#qna 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr문제 설명 어떤 게임에는 붕대 감기라는 기술이 있습니다.붕대 감기는 t초 동안 붕대를 감으면서 1초마다 x만큼의 체력을 회복합니다. t초 연속으로 붕대를 감는 데 성공한다면 y만큼의 체력을 추가로 회복합니다. 게임 캐릭터에는 최대 체력이 존재해 현재 체력이 최대 체력보다 커지는 것은 불가능합니다.기술을 쓰는 도중 몬스터에게 공격을 당하면 기술이 취소되고, 공격을 당하는 순간에는 체력을 회복할 수 없습니다. 몬스터에게 ..

▤ 목차1. break문 사용법 1. break문 break는 주로 if문과 함께 사용되어 특정 조건을 만족하면 반복문을 벗어나도록 한다.break문은 자신이 포함된 가장 가까운 반복문을 벗어난다.for(int i=0; i 2. 중첩 break문중첩 반복문(여러 개 for문) 일 경우에 현재 위치한 가장 안쪽의 반복문에서 빠져나오고 다시 제일 바깥쪽의 반복문을 실행하게 된다.for(int i=0; i 3. 라벨 붙은 break문break문은 근접한 단 하나의 반복문만 벗어날 수 있기 때문에, 중첩 반복문 경우에는 불필요한 반복이 발생할 수 있다. 중첩된 반복문을 벗어나고 싶다면 각 반복문마다 라벨을 지정해 주고 해당 라벨명을 break 명령에 기재하여 원하는 반복문 단계를 바로 빠져나올 수 있다.Loop..

▤ 목차1. 문제설명https://school.programmers.co.kr/learn/courses/30/lessons/250121#qna 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr문제 설명 AI 엔지니어인 현식이는 데이터를 분석하는 작업을 진행하고 있습니다. 데이터는 ["코드 번호(code)", "제조일(date)", "최대 수량(maximum)", "현재 수량(remain)"]으로 구성되어 있으며 현식이는 이 데이터들 중 조건을 만족하는 데이터만 뽑아서 정렬하려 합니다.예를 들어 다음과 같이 데이터가 주어진다면data = [[1, 20300104, 100, 80], [2, 20300804, ..

▤ 목차1. 문제설명https://school.programmers.co.kr/learn/courses/30/lessons/250125#qna 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr문제 설명 각 칸마다 색이 칠해진 2차원 격자 보드판이 있습니다. 그중 한 칸을 골랐을 때, 위, 아래, 왼쪽, 오른쪽 칸 중 같은 색깔로 칠해진 칸의 개수를 구하려고 합니다.보드의 각 칸에 칠해진 색깔 이름이 담긴 이차원 문자열 리스트 board와 고른 칸의 위치를 나타내는 두 정수 h, w가 주어질 때 board[h][w]와 이웃한 칸들 중 같은 색으로 칠해져 있는 칸의 개수를 return 하도록 solution ..