본문 바로가기
728x90
반응형

etc24

[원티드 9월] 반응형 웹사이트 기초 원티드에서 반응형 웹 사이트 관련된 강의가 있어서 참여하게 되었다. 평소에 반응형 웹 사이트에 관심이 많았기 때문에 아주 흥미로웠다. 반응형 웹 사이트 반응형 웹사이트는, 기기의 화면의 크기 맞춰 자동으로 레이아웃 및 콘텐츠 구성하는 개발방법이다. 아래와 같은 이유로 중요성이 증가했다. 1. 스마트폰의 대중화로 인해 중요성 인식 2. 인터넷에 접속되는 기기가 다양해지면서 더 다양한 스크린에 대응해야 하는 이슈 ex. 스마트폰, 랩탑, PC, 워치, 티비, 자동차, 냉장고 반응형 웹 사이트 범위 1. 화면 크기(viewport) 2. 화면 방향 3. 픽셀 밀도(해상도) 4. 화면 비율 5. 마우스 포인터 6. 프린트 장치 7. 컬러 & 컬러모드 8. 주변 광도(최신 기술이라서 안되는 웹사이트도 있음) 9... 2023. 9. 8.
[모던 자바스크립트 딥다이브] 1장 ~ 6장 위 서적을 읽고 중요하다고 생각되거나 모르는 부분을 정리했습니다. 1. 프로그래밍 1. 사람이 이해할 수 있는 자연어로 구성된 프로그래밍 언어를 사용해 프로그램을 작성한다. 2. 컴퓨터가 이해할 수 있는 기계어로 변환하는 번역기인 컴파일러(혹은 인터프리터)를 이용한다. 3. 컴퓨터가 이해할 수 있는 기계어로 변환된다. 2. 자바스크립트란? 2-1. Ajax(Asynchronous Javascript And XMLHttpRequest) Ajax는 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능입니다. 이전의 웹 페이지는 완전한 HTML 코드를 서버로부터 전송받아 웹 페이지 전체를 렌더링하는 방식으로 동작했습니다. 그래서 아래와 같은 단점이 있었습니다. 1. 불필요.. 2023. 9. 7.
구름톤 챌린지 4주차 학습 일기 - BFS(모든 섬 방문하는 문제) 모든 섬을 방문해야하는 문제이기 때문에, BFS로 문제를 해결할 수 있다. 1. 그래프 입력 자바스크립트에서 그래프를 선언할 때는 인접 리스트 방식으로 그래프를 선언하고, 이때 사용하는 자료구조는 객체이다. 2. 연합의 개수 세기 위한 visited 변수 사용 visited는 섬의 방문 여부, 어떤 연합에 속해 있는지 확인할 수 있다. 1. visited = Array(N + 1).fill(0); 로 visited의 모든 요소를 0으로 초기화 한다. 2. visited[Node]의 값이 0이면, 그 섬은 어떤 연합에도 포함되지 않은 섬이다. 3. 연합에 속하지 않는 섬에서, 새로운 연합을 만들었을 때 이를 i번 연합이라고 한다. 4. i번 연합에 속한 섬들은 visited[Node] = i로 갱신한다. .. 2023. 9. 6.
구름톤 챌린지 3주차 학습 일기 - DP(동적 계획법) DP, 다이나믹 프로그래밍, 동적 계획법 이라고 불리는 기법은 이전에 구했던 답을 재활용하는 방식이다. 다시 말해, 이전에 구한 값을 저장해두고 다시 사용하므로써 불필요한 중복 계산을 최대한 줄이는 방법이다.(메모이제이션) 예를 들어서, 피보나치 수열을 재귀로 구현해보면 아래와 같다. 참고로 피보나치 수열은 처음 두개의 값이 0과 1이고, 이 다음 값은 맨 끝의 두 값을 더해서 만들어진다. 0, 1, 1, 2, 3, 5, 8, 13, 21, ... function fibo(N){ //첫 두값을 종단점으로 잡아줍니다. if (N === 0) return 0; if (N === 1) return 1; // N 번째 피보나치수는 N - 1번째, N - 2번째 피보나치수의 합이므로 재귀로 호출합니다. retur.. 2023. 8. 29.
구름톤 챌린지 2주차 학습 일기 v2 (2차원 배열 완전 탐색, dx/dy 기법) 2차원 배열에서 자주 사용되는 기법인 dx/dy 기법에 정리하려고 한다. dx/dy 기법은 현재 내 위치에서 상화좌우, 대각선 방향으로 이동이나 탐색을 구현할 때 사용한다. 예를 들어 arr[1][1]의 상하좌우 값은 arr[0][1], arr[2][1], arr[1][0], arr[1][2] 다. 이를 인덱스로 표현한다면 아래와 같다. dx = [0, 0, -1, 1] // 열 dy = [-1, 1, 0, 0] // 행 이를 코드로 적용해보면 아래와 같다. let dx = [0, 0, -1, 1]; let dy = [-1, 1, 0, 0]; // 시작 위치 설정 let x = 1; let y = 1; // 4방향 탐색 for (let i = 0; i < 4; i++) { let nx = x + dx[i.. 2023. 8. 23.
728x90
반응형