JavaScript란?
·
HTML,CSS,JS
JavaScript란? 웹 페이지에 생동감을 불어넣기 위해 만들어진 프로그래밍 언어(동적) 정적인 HTML과 CSS로 만들어진 웹 페이지를 동적으로 변경해줌 웹페이지 조작, 클라이언트-서버 간 상호작용에 관한 모든 일 관련 그럼 script는 뭘까? script는 자바스크립트로 작성한 프로그램을 부르는 용어 script는 웹페이지의 HTML 안에 작성가능 -> 웹 페이지를 불러올 때 자동 실행(컴파일러 X) • JavaScript 엔진 자바스크립트 코드를 해석하고 실행하는 인터프리터 동작과정 엔진이 스크립트를 읽음(파싱) 읽어드린 스크립트가 기계어로 전환(컴파일) 기계어로 전환된 코드가 실행됨 -> 기계어기 때문에 속도 빠름 뭔가 이상하다 자바스크립트는 인터프리터 언어라면서 컴파일이라는 단어가 왜 나오지..
JavaScript 기본 문법
·
HTML,CSS,JS
• 변수 하나의 값을 저장하기 위해 확보한 메모리 공간 자체, 또는 메모리 공간을 식별하기 위해 붙인 이름 JavaScript는 개발자가 직접 메모리 제어를 하지 못함(managed language) -> 변수를 통해 안전하게 값에 접근 const myNumber = 22; //변수명(식별자) : myNumber //해당 값의 위치(메모리 주소) : 00153DFAE87 //Value : 22 변수명인 myNumber은 변수의 값이 아닌 메모리 주소를 기억함 변수명 사용 -> 자바스크립트 엔진이 변수명과 매핑 된 메모리 주소를 통해 22 반환 • 변수 선언 JavaScript에서 변수 선언은 선언 -> 초기화 단계를 거침 선언 = 변수명을 등록하여 자바스크립트 엔진에 변수 존재 알림 초기화 = 값을 저장..
[Git] Git Workflow(Git-Flow, GitHub-Flow)
·
Git
브랜치 전략에 대해 얘기하기 전에 • 브랜치란?독립적으로 어떤 작업을 진행하기 위한 개념개발자들이 동시에 다른 작업을 할 수 있게 만들어 주는 기능각각의 브랜치는 다른 브랜치의 영향을 받지 않음하늘색 : main(master) 브랜치보라색, 초록색 : 분기된 브랜치 main 브랜치의 코드를 통째로 복사해서 나의 브랜치로 이동 후 나의 브랜치에서 개발을 진행하는 것이 일반적임• Git Workflow가 뭔데?Git은 브랜치로 작업을 관리하는데팀에서 브랜치를 어떻게 사용할 지에 대한 규칙을 Workflow 라고 함• Git Flow총 5가지의 브랜치를 사용master, develop, feature, release, hotfix - master 브랜치 제품을 배포하는 브랜치  - develop 브랜치 mas..
[Git] Git/GitHub
·
Git
Git과 GitHub란 단어는 개발자라면 정말 많이 들어봤을 것이다.특히 협업하려면 GitHub 사용법을 꼭꼭 알아야 한다는 얘기도 많이 들어봤다.(사실 지금까지 Git=GitHub 인줄..ㅎㅎ)• Git이란?- 버전 관리 시스템(VCS)- 로컬에서 버전 관리- 소스코드 수정에 따른 버전 관리 해주는 시스템 로컬 = 내 PC컴퓨터 고장나서 내부 정보 날라간다? 그럼 복구 안돼....• GitHub이란?- 서버에 올라간 Git- Git의 기본적인 기능 확장- 클라우드 서버를 사용해서 로컬 소스 코드 업로드하여 공유 가능- 빌려쓰는 클라우드 개념(서버 빌려준다고 생각하면 됨)- 버전 관리, 소스 코드 공유 등등 가능한 원격 저장소 -> 협업을 위해선 GitHub 사용!• 버전 관리 시스템(VCS)- 너무 많..
[WEB] XML, JSON, YAML
·
WEB
• 공통점- 데이터 표현 방식- 텍스트 형식 직렬화 : 사람이 쉽게 읽을 수 있는 형태로 직렬화  간단히 말하자면 사람이 정보 읽기 쉬운 형태(직렬화 개념은 구글링해서 알아보자..!) 이제 차이점을 알아보자!• XML  깜이 미니핀 12 산책 간식먹기 5.8- 태그를 사용 -> name을 두 번 써야해서 작성하기 불편함- 가독성도 그닥..- 어느정도 오타 허용 -> 태그가 있기 때문에 오타가 나더라도 해당 태그 부분 제외하고 읽을 수 있음- 주석 달기 가능• JSON{ "name" : "깜이", "family" : "미니핀", "age" : 12, "hobby" : ["산책", "간식먹기"], "weight" : 5.8}- javascript의 객체 표현방식- 문법 오..
[WEB] MPA/SPA
·
WEB
•  MPA/SPA- MPA = Multiple Page Application여러 개의 페이지로 구성된 Application새로운 페이지 요청할 때마다 전체 페이지가 렌더링 됨 -> SSR 방식으로 렌더링 - SPA = Single Page Application한 개의 페이지로 구성된 Application모든 정적 리소스를 최초 한 번에 다운로드 -> CSR 방식으로 렌더링이후 새로운 페이지 요청 시, 필요한 부분만 수정해서 보여줌페이지 데이터와 레이아웃을 별도로 요청하고 결과를 브라우저에 직접 렌더링 가능•  MPA 장단점장점- SEO(검색 엔진 최적화) 관점에서 유리함-> 여러 페이지를 생성하기 때문에 많은 수의 키워드가 생김-> JavaScript 코드가 동작하기 전에 HTML에 데이터가 삽입된 상..