전체 글
CSS 추가하는 3가지 방법
CSS 추가하는 3가지 방법
2022.11.13이번 포스트에서는 CSS를 추가하는 3가지 방법을 다룹니다. CSS를 추가하는 방법으로는 첫 번째, 인라인 스타일링(inline style), 두 번째 head 태그에 style 태그를 추가해서 넣는 방법, 세 번째로 CSS 파일을 만들어 연결해주는 방법이 있습니다. CSS 의미? CSS를 적용하기 전에 CSS의 의미를 먼저 보고 넘어가려고 합니다. CSS는 Cascading Style Sheets를 의미합니다. 여기서 Cascading은 네이버 영어 사전의 뜻으로 '1. 작은 폭포 2. 폭포처럼 흐르다 3. 풍성하게 늘어지다' 뜻을 가집니다. 즉, 여러 규칙이 같은 요소에 적용됨을 의미합니다. F12 크롬 개발자 도구 style 칸에서 casecading을 확인할 수 있는데요, 아래 캡처 사진처럼 하나..
자바스크립트 배열 생성, 추가, 삭제 방법
자바스크립트 배열 생성, 추가, 삭제 방법
2022.11.12자바스크립트에서 배열(Array)을 사용하면 데이터를 조금 더 간단하고 깔끔하게 표현하고 저장할 수 있습니다. 이번 포스트는 자바스크립트에서 배열을 생성하는 방법, 생성된 배열에 새로운 값을 추가하는 방법, 기존 배열에 있는 값을 삭제하는 방법을 다룹니다. 자바스크립트, 배열은 무엇인가? 자바스크립트에서 배열은 Object와 같은 리스트를 의미합니다. 실제로 F12키를 눌러서 나오는 console에서 배열을 생성하고, typeof를 했을 때 반환하는 값도 Object입니다. 배열은 다양한 값을 보관해주는 하나의 object를 의미합니다. 다른 변수와 다른 점은 배열을 사용하면 각각의 값에 접근할 수 있고, for 문이나 배열 함수를 이용해서 각 값을 효율적으로 연산할 수 있습니다. 배열이 없다면, 값을 ..
파이썬 리스트 입출력, 초기화의 모든 것
파이썬 리스트 입출력, 초기화의 모든 것
2022.11.04C언어로 알고리즘 문제를 풀다가 파이썬 알고리즘 문제를 풀 때 마주치는 큰 벽 중 하나가 리스트(list)라고 생각합니다. a=[1,2,3,4] 이런 식으로 사용하면 되고, 슬라이싱 a [1: 3] 배울 때만 해도 나름 간단하다고 생각되지만, 코딩 문제에서 2차원 배열을 만드는 문제를 만나고, 입력이 특이한 알고리즘 문제를 만나면 공부를 쉬고 싶어 지는데요, 그래서 이번 포스팅에서는 파이썬 리스트 입출력, 초기화의 모든 것을 다룹니다. 파이썬 리스트 입출력, 초기화 정리 우선 이 포스팅에서 다룰 내용은 다음과 같습니다. 1. 리스트 생성 2. 입출력과 리스트 (1차원, 2차원) 파이썬 리스트 생성 파이썬에서 리스트를 생성하는 방법으로 2가지 방법이 있습니다. 첫 번째는 대괄호 []로 선언하는 방법이 있고..
React 시작 Create react app, npm install 차이점
React 시작 Create react app, npm install 차이점
2022.11.01React를 시작하기로 마음먹었다면 이 포스팅을 보면 됩니다. 이번 포스팅에서는 리액트가 무엇인지, 컴포넌트가 무엇인지, node.js를 다운로드한 다음에 리액트 프로젝트를 띄우기 위한 create-react-app을 입력하는 방법, npm install을 사용하는 이유에 대해서 알아봅니다. React 시작하는 방법 React는 무엇인가? 리액트는 선언적이고 (declarative), 효과적이고 (efficient), 유연한 (flexible) 자바스크립트 라이브러리입니다. React를 이용하면 여러 개의 컴포넌트(component)로 복잡한 UI를 만들 수 있습니다. 참고로 바닐라 자바스크립트는 절차형 프로그래밍(imperative)입니다. 절차형(imperative)응 컴퓨터가 이해하기 쉽도록 명시적..
VSCode 커서 여러 개 선택하기, 멀티 커서
VSCode 커서 여러 개 선택하기, 멀티 커서
2022.10.28코드 강의를 보다가 선생님이 갑자기 커서를 여러 개 설정하고 한 번에 코드를 치는 모습에 당황하신 적 있으시죠? 멀티 커서의 존재를 알고 나면 선생님처럼 빠르게 코딩이 가능합니다. 반복되는 부분이 많을 때 사용하기 좋은 기능이에요. VSCode 멀티 커서, Alt + Shift 일반적으로 좌클릭을 하고, 코드 선택을 할 때 Wrapping selection이 됩니다. 위 그림처럼 클릭한 부분부터 현재 있는 커서까지 전체 줄이 선택됩니다. 이 상태에서 "expense-date" 부분을 그냥 "date"로 클래스 이름을 바꾸려면 하나하나 클릭해서 바꿔줘야 합니다. 클릭 버튼을 계속 누른 상태에서 alt+shift 버튼을 누르고 움직이면 wrapping selection에서 box selection으로 선택이..
캡슐옷장, 프로젝트 333
캡슐옷장, 프로젝트 333
2022.10.26날이 쌀쌀해지는 10월, 앞으로 추워질 날만 있다는 것을 알기에 옷장을 보면 정리해야 한다는 압박감이 있었습니다. 옷 정리를 하기 전에, 어떻게 하면 옷 정리를 잘할 수 있을까 고민하다가 프로젝트 333 책을 만났습니다. 프로젝트 333은 캡슐 옷장을 만드는 방법을 알려주고, 우리 삶에서 본질을 찾는 방법도 알려주는 책입니다. 옷뿐만이 아니라 마음을 비우고 싶을 때 읽으면 좋은 책이에요. 물건과 쇼핑은 당신을 행복하게 해주지 않는다 부정적인 감정으로 힘들 때, 몸은 '쇼핑하러 가자'라고 말하지 않습니다. '나를 돌봐줘'라고 말합니다. 마음이 공허해서 쇼핑하는 것인지, 정말 쇼핑하고 싶은 건지 한 번 더 생각해봐야 한다고 말합니다. 김경필 머니 트레이너님의 행복 정의가 떠올랐는데요, 행복감은 가진 것 나누..
JavaScript 에러 해결 방법
JavaScript 에러 해결 방법
2022.10.25이번 포스트에서는 JavaScript 코드를 입력하면서 만날 수 있는 error에 대해서 다루고자 합니다. 그리고 error와 관련된 JavaScript 개념을 함께 소개합니다. JavaScript 에러 해결 방법 Assignment to constant variable 타입 에러, const 변수에 재할당을 시도했을 때 보이는 에러입니다. TypeError: Assignment to constant variable. 아래 코드에서 myName='min'; 부분이 재할당하는 부분으로 보이는데, 이 부분을 없애거나, 다른 변수를 만들어서 해당 오류를 없앨 수 있습니다. 또는 const myName = 'max';이 부분을 let myName ='max';로 설정해주어서 여러 번 할당받을 수 있도록 설정할 ..
소스 트리 설치하기
소스 트리 설치하기
2022.10.10소스트리 설치 windows 환경에서 Sourcetree를 설치하는 방법을 설명합니다. 소스트리 공식 사이트 주소는 sourcetreeapp.com 입니다. 소스트리 홈페이지 소스트리는 Git을 사용자 입장에서 더욱 편리하게 사용하도록 만든 클라이언트 프로그램입니다. Windows와 iOS에서 사용 가능하고, 무료입니다. 소스트리는 버전 관리 이력을 직관적인 그래프와 색으로 표현해주기 때문에 code 버전 관리할 때 사용하면 좋은 프로그램입니다. 그리고 GUI 기반으로 동작하기 때문에, CLI 기반이 어렵다고 생각하는 초보자가 사용하기 더욱 적절한 도구입니다. https://www.sourcetreeapp.com/ Sourcetree | Free Git GUI for Mac and Windows A Gi..
파이썬 다익스트라 2가지 방법으로 구현 (for, heapq)
파이썬 다익스트라 2가지 방법으로 구현 (for, heapq)
2022.10.09최단 경로 알고리즘은 길 찾기 문제에서 사용할 수 있는 알고리즘입니다. 주로 '어느 한 지점에서 다른 특정 지점까지의 최단 경로를 구해야 하는 경우', '모든 지점에서 다른 모든 지점까지의 최단 경로를 모두 구해야 하는 경우'에 사용합니다. 이번 포스트에서는 'start 지점에서 다른 정점까지의 최단 경로를 찾는 다익스트라(dijkstra) 알고리즘에 대해서 소개합니다. 파이썬 다익스트라 알고리즘 다익스트라 최단 경로 알고리즘 그래프에서 여러 개의 노드가 있을 때, 특정한 노드에서 출발하여 다른 노드로 가는 각각의 최단 경로를 구해주는 알고리즘입니다. 아이디어는 다음과 같습니다. 1. 출발 노드를 설정한다. 2. 최단 거리 테이블을 int(1e9)로 초기화한다. 3. 방문하지 않은 노드 중에서 최단 거리..
파이썬 다이나믹 프로그래밍 잘하는법
파이썬 다이나믹 프로그래밍 잘하는법
2022.10.04알고리즘 공부를 시작했을 때, 이름만 보고 거부감이 들기 쉬운 다이나믹 프로그래밍을 잘하는 방법을 소개합니다. 저는 코딩 테스트를 준비할 때 따로 학원에 다니지 않아서, 주변에서 '다이나믹 프로그래밍 문제 짜증이 나'라는 얘기를 들으면 약간 불안했습니다. 왜냐하면 이름만 듣고 주눅 들었기 때문이죠. '다이나믹 프로그래밍은 다이나믹한 기술을 사용하나? 어렵다고 하니까 정말 어렵나 보다.' 생각했습니다. 하지만 다이나믹 프로그래밍의 정의를 알고, 문제를 여러 개 풀어보니 다이나믹 프로그래밍은 수학 점화식을 찾아가는 과정이라고 결론 내렸습니다. 모든 알고리즘 문제가 그렇듯 특정 유형의 문제를 여러 개 풀어보니 dp가 두렵지 않았습니다. 아래 저의 solved.ac 결과를 보면 아시겠지만, 저는 dp, grap..
신녀성의 레미장센 책 리뷰, 여성의 욕망
신녀성의 레미장센 책 리뷰, 여성의 욕망
2022.10.03신녀성님을 알게 된 건 유튜브 알고리즘이 추천해주어서 알았습니다. "고급 취향으로 인생 바꾸는 방법" 썸네일을 보고 이 영상은 그냥 지나칠 수 없다고 생각하고 클릭하고 봤습니다. 처음 볼 때는 조금 불편한 기분이 들었는데, 다시 생각해보니 제가 모르던 세계를 알려주는 사람이라고 생각했고, 내용도 매우 흥미로워서, 침대에 누워서 업로드된 영상을 정주행했습니다. 그런데 또 찾아보니 신녀성님의 네이버 블로그에도 여러 글을 올렸더라고요. 특정 글은 구독한 사람들만 볼 수 있다고 공지가 있어서, 블로그 구독도 신청해서 매주 글을 봤습니다. 흥미롭게 보다가 제가 사는 세상과 너무 다르게 느껴져서 중간에 구독을 취소했지만요. 그렇게 시간이 흐르고, 신녀성님이 책을 출간하셨다고 했을 때 책 내용이 너무 궁금했습니다. ..
애드센스 바이블: 최신 애드센스 안내서
애드센스 바이블: 최신 애드센스 안내서
2022.10.01역행자 책을 읽고 자극받아서 7월 말부터 블로그 포스팅을 쓰기 시작했는데요, 처음에는 한 명도 검색으로 들어온 분이 없다가 이제 몇 명씩 검색을 통해 제 블로그에 방문해주시니 너무 기뻤습니다. 제 블로그가 검색이 잘 되려면 어떤 부분에 유의하면서 글을 써야할지 고민하던 중에 가볍게 읽기 좋은 애드센스 책을 발견하여 이번 포스트에서 소개합니다. 애드센스 바이블 책 리뷰 애드센스 바이블 책은 바루다(한상하)님이 쓰신 책입니다. 분홍색 표지이고, 총 196페이지인 가볍게 읽기 좋은 책이었습니다. 이전에 읽었던 애드센스 책은 2016년에 쓰인 책이라 최신 경향을 담지 못한 느낌이어서 이 책을 읽기로 결심했습니다. 애드센스 바이블 책은 2022년 6월에 출간된 책이고, 블로그를 시작하는 방법, 애드센스 승인 받는..