본문 바로가기

분류 전체보기

(54)
[JS] 3. 기초 문법: 변수와 상수 1) 변수 변수: 프로그램이 실행되는 도중 계속해서 바뀌는 값을 저장. [변수 선언] ① let 키워드 (권장) let num = 10; // 변수 선언: let 변수명 = 값; console.log(num); // 10 num = 100; // num의 값 변경 console.log(num); // 100 ② var 키워드 var 키워드를 이용해서도 변수를 선언할 수 있지만, var는 같은 이름을 가지는 변수를 중복해서 선언하는 것을 허용하기 때문에 let 키워드를 사용하는 것이 좋습니다. var num1 = 10; var num1 = 20; //오류 발생하지 않음 let num2 = 10; let num2 = 20; // *오류 발생 [변수 이름 규칙] '_'(언더 스코어)와 '$'(달러)를 제외한 ..
[JS] 2. 자바스크립트 개발 환경 1) 웹 브라우저의 개발자 도구 [개발자 도구 열기] 윈도우: f12 또는 ctrl + shift + i macOS: command + option + i * 개발자도구 console은 명령어를 입력하고 enter키를 칠 때마다 바로 실행이 되기 때문에 긴 코드를 작성하기에는 적절하지 않습니다. 2) 온라인 웹 에디터 https://codesandbox.io/ CodeSandbox: Online Code Editor and IDE for Rapid Web Development Optimized for frameworks Custom environments built specifically for React, Vue, Angular, and many more. codesandbox.io 코드를 입력하면 자..
[JS] 1. JavaScript & React 개념 1) 자바스크립트(JavaScript)란? JavaScript: 웹 사이트에 활력을 부여하는 언어. 자바스트립트는 HTML, CSS와 더불어 웹을 개발하는 세 가지 언어 중 하나입니다. 웹 사이트에 '활력'을 부여한다는 것은 어떤 의미일까요? HTML이 요소들의 배치와 내용을 담당하고, CSS가 HTML로 작성한 요소들의 색,크기,애니메이션 등의 스타일링을 담당한다면, 자바스크립트는 웹 페이지의 모든 동적인 부분을 담당합니다. 즉, 자바스크립트는 웹 사이트를 실질적으로 움직이도록 하는 역할을 합니다. 자바스크립트를 이용하여 동적으로 콘텐츠를 바꾸고, 멀티미디어를 제어하고, 애니메이션을 추가하고, 서버로부터 데이터를 주고 받는 등 거의 모든 것을 만들 수 있습니다. 웹 페이지의 내용이 정적인 정보만을 보여..
[GitHub&소스트리] 4. 변경 사항 취소하기 & Branch 작업을 하다보면 수많은 변경 사항들이 생기고, 변경하기 이전으로 되돌아 가야 하는 상황들이 발생합니다. 그런데 변경 사항을 작성하고 저장까지 한 상태에서 다시 변경 이전의 내용으로 되돌아 갈 수 있을까요? 1) 변경 사항 취소하기 git에서는 변경 사항을 취소하기 위해 특정 커밋으로 되돌아가는 checkout이라는 명령어를 사용하는데, SourceTree에서 '코드뭉치 버리기' 기능을 이용하여 더욱 쉽게 가능합니다. 2) 브랜치(Branch) 기존의 코드를 지우지 않고 그 코드를 대체할 다른 코드를 작성하고 싶을 때 주석 처리를하곤 합니다. 하지만 기존의 코드를 주석 처리하고 새로운 코드를 작성하게 되면 코드가 지저분해지고 복잡해지면서 스파게티 코드가 되어버립니다. 이런 경우 주석 처리 대신 브랜치를 이..
[GitHub] 3. 커밋(commit) 메시지 작성법 및 주의사항 1. 커밋 메시지 작성법 첫 줄에 간단하지만 명확하게 내용을 작성합니다. 자세한 내용은 첫 줄 작성 후 한 줄을 비우고 작성합니다. 2. 주의사항 반드시 한 번에 하나의 논리적 작업만을 커밋합니다. 즉, 한 번에 한 문장으로 설명 가능한 단위로 커밋합니다. 미래의 자신과 다른 개발자와의 협업을 위해 메시지는 잘 작성해야 합니다.
[GitHub] 2. 토큰 생성 깃허브는 토큰 인증 방식을 사용하기 때문에 깃허브 로그인을 위해서는 토큰을 생성해야 합니다. 여기에서 토큰은 패스워드와 같은 역할을 합니다. 토큰을 생성한 이후에는 push할 때 토큰 인증 방식을 사용하여 로그인합니다. [토큰 생성 방법] 설정(Settings) → Developer settings → Personal access tokens → Generate new token * 생성 시에 발급 받은 토큰은 다시 확인할 수 없습니다. 반드시 토큰을 복사하여 따로 저장을 해두어야 합니다. 토큰을 저장하지 못 했다면 해당 토큰을 삭제하고 재생성(Regenerate token)합니다. * 토큰에 부여된 권한은 변경 가능합니다.
[GitHub] 1. Git & GitHUb 개념, 소스트리 1. Git, GitHub란? Git: 컴퓨터 파일의 변경사항을 추적하고 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전 관리/형상 관리 시스템. ↳ 소프트웨어 개발에서 소스 코드를 효과적으로 관리할 수 있도록 하는 도구로서 무료, 공개 소프트웨어입니다. ↳ 작업한 파일에 대한 변경 정보를 실시간으로 기록하고, 버전 관리를 통해 체계적인 개발이 가능하도록 합니다. ↳ 소스코드를 별도로 주고 받을 필요 없이 여러 사람이 동시에 작업하는 병렬 개발이 가능합니다. * 버전 관리: 파일들을 복사, 백업, 저장 등을 해서 관리하는 것. GitHub: 분산 버전 관리 툴인 깃(Git)를 사용하는 프로젝트를 지원하는 웹호스팅 서비스. ↳ 내 컴퓨터에 있는 깃의 히스토리(기록)을 가져와서 깃허브..
3. HTML & CSS 활용 3.1 CSS 리셋 브라우저마다 태그를 렌더링하는 기본 스타일이 다름 à 모든 브라우저에서 동일한 화면화 볼 수 있도록 기본값을 초기화 [리셋 CSS 스크립트 제공] https://cssreset.com/ 3.2 IR 기법 1) IR 기법_요소 숨김 처리 IR: Image Replacement – 이미지를 볼 수 없는 사용자에게 적절한 대체 텍스트를 제공하는 것. [용도] alt 속성값으로 표현하기에 대체 텍스트가 너무 긴 경우, CSS background 속성을 사용하여 처리(배경 이미지로 처리)한 의미 있는 이미지일 경우 [방법] 시멘틱하게 마크업 + CSS로 숨김 처리 + 스크린 리더가 읽을 수 있도록 ① 사용하지 말아야 하는 방법 (스크린 리더가 인식하지 못 하기 때문) ↳ visibility: ..