본문 바로가기

전체 글

(177)
Javascript 기초(7) - 함수, 콜스택, 스코프 체인, this 1) Javascript 복습 1-1) 함수 선언과 호출 1-2) 콜스택 1-3) 스코프 체인 1-4) this 1-5) function(this binding) 1-6) function의 다양한 활용 1) Javascript 복습 1-1) 함수 선언과 호출 함수 선언과 호출의 차이를 이해하는 것이 중요하다!! 함수 선언문 function add(a, b) { return a + b; } add(1, 2); // 결과: 3 function calculator(func, a, b) { return func(a, b); } calculator(add, 1, 2); // 결과: 3 함수 표현식(arrow function) const add = (a, b) => a + b; const calculator = (..
git & github 기초(2) - github Pull Request, issues, Fork, github.io 1) github 1-1) Pull Request 1-2) issues 1-3) Fork 1-4) github.io 1) github 1-1) Pull Request 중요 point : 절대 main branch는 건들지 않는다!! (pull request 진행 순서) 프로젝트를 진행하는 과정에서 git 관리자(main 개발자)가 우선 본인의 local main branch에서 최초 commit(init commit)을 하나 생성(init commit은 예를 들어 최초 작업으로서 index.html을 생성하는 commit으로 보면 됨!!)한 뒤 이를 원격 저장소로 push한다! 그럼 github의 원격 저장소에는 main branch에 init commit이 하나 생성되어 있을 것이다! 이후 git 관리..
git & github 기초 - branch 합치기, github 기본원리 1) branch 합치기 1-1) merge 1-2) rebase 2) github 기본원리 2-1) token 넣기 2-2) 보내기 & 가져오기 +) 과거 commit 수정 3) git & github 실습 1) branch 합치기 branch를 합치는 방법은 크게 2가지가 있는데 바로 "merge"와 "rebase"이다!! 1-1) merge 기점(merge 실행 후 branch가 사라지지 않고 남아있는 branch)을 중심으로 commit이 하나 더 생겨 합쳐진다! * merge hell : merge가 너무 많아지면 git graph 상 commit과 branch 구조가 굉장히 복잡해진다!! merge의 장점 : 히스토리 추적이 가능하기에 어떤 상황인지 파악하기가 용이하다!! develop bra..
git 기초 - 기본 개념 및 작업 순서, commit, branch 1) git 1-1) 설치 및 기본 설정 1-2) 작업 순서도 1-3) 명령어 1-4) branch 2) git 실습 1) git 1-1) 설치 및 기본 설정 git : 소스 현상 관리 툴(상호 간의 코드 버전을 관리하는 툴) 소스 현상 관리 툴에는 SVN, git(대표적인 소스 현상 관리 툴)이 있다! 개발자의 경우, git은 선택이 아니라 필수로 잘 다뤄야 하는 툴이다! 프로젝트 단위(폴더)별로 여러 버전을 나누어 관리할 수 있게 해주는 툴이 'git'이다!! git 설치 $ git --version -> git이 깔려 있는지 버전을 확인하는 코드 # (result) git version 2.36.1 git 업데이트 Windows에서 update하는 방법 $ sudo apt update $ sudo ..
Linux 기초(2) - 사용자 계정 및 그룹, Shell, 패키지 매니저 1) Linux 1-1) 사용자 계정 1-2) 명령어 1-3) 사용자 그룹 1-4) Shell 1-5) 패키지 매니저 2) CLI 실습 1) Linux 1-1) 사용자 계정 Linux 구조의 특징 중 하나 : 멀티 유저(여러 사용자가 동시에 하나의 시스템에 접근하는 것을 의미) Linux에서 작동하는 모든 파일과 directory는 사용자에서 시작된다! => 즉, 애초에 Linux를 사용하려면 로그인이 필요하므로 로그인된 상태에서 파일과 directory를 만들 수 있다는 의미!! ex) sangbeom이라는 사용자가 있고, hongtae라는 사용자가 있다고 가정해보자. sangbeom으로 로그인된 상태에서 vi를 통해 hello.txt라는 파일을 생성했다. hongtae라는 계정이 hello.txt 파..
Linux 기초 - 기본개념 및 directory, CLI 1) Linux 1-1) Linux 구조 1-2) Linux 특징 1-3) Ubuntu 1-4) directory 구조 1-5) CLI 2) CLI 실습 1) Linux 1-1) Linux 구조 OS 종류는 크게 네 가지로 "Windows", "MacOS", "Linux", "Unix"가 있다! (Mobile OS의 경우, Android와 iOS가 있다!) - 하드웨어 : 눈으로 보고 만질 수 있는 것 → ex) 마우스, 키보드 등 - 소프트웨어 : 사용자가 직접 못 보고 만질 수 없는 것 → ex) OS, zoom, VSCode, LOL(게임) 등의 프로그램 하드웨어를 조작하는 소프트웨어를 "OS"라고 한다! 즉, 우리가 많이 사용하는 스마트폰, 데스크탑(PC)의 경우 하드웨어만 존재한다면 컴퓨터 전원..
DOM 기초(10) - 게시판 구현(CRUD) 정리 및 배열 메서드 1) 코드 실습 1-1) 게시판 구현(CRUD) 1-2) 배열 메서드 1) 코드 실습 1-1) 게시판 구현(CRUD) 게시판 흐름 (1) list page - localStorage(로컬 스토리지)에 데이터가 이미 존재하는 경우와 없는 경우를 구분해야 함!! (즉, 처음 접속한 사람과 두번째 접속한 사람을 구분하여 데이터 case를 나눈다!!) // 처음 접속한 사람인지 아닌지를 구분하기 위한 코드 let item = localStorage.getItem("boards"); if (item === null) { const initialState = []; const state = JSON.stringify(initialState); localStorage.setItem("boards", state); i..
DOM 기초(9) - 댓글 구현 기능 보강(CRUD), 게시판 기초 1) 코드 실습 1-1) 댓글(CRUD) - 총 댓글 개수 표시 및 Update 기능 보강 1-2) 게시판 기초 1) 코드 실습 1-1) 댓글(CRUD) - 총 댓글 개수 표시 및 Update 기능 보강 댓글 구현 - submitHandler >> state(데이터 타입: 배열): [] 위의 "state" 배열에 데이터를 쌓는 것이 전부이다!! - instance 변수(데이터 타입: Object): >> new Comment(value) >> value : TEXT 입력폼에 입력한 값 const state= []; const instance = { userid: 'web7722', Content: content, updated: false, updateValue: '', now: '....', } add..