텍스트 에디터 nano 패키지 매니저 npm node.js의 버전관리매니저 nvm javasscript 또 다른환경 분산 제어 시스템 git Command-Line interface 개요 입력소스 : 컴퓨터에 새로운 명령을 전달하는 모든소스(키보드,마우스) 출력소스:시각적출력(모니터),청각적출력(스피커) 리눅스터미널:컴퓨터를 조작하기 위해 사용 CLI는 GUI가 할수있는 작업 모두 한다. AWS는 데이터센서를 가지고 있으며, 데이터센서에서 서버컴퓨터 설치 CLI를 이용해 서버컴퓨터 접속요청->서버컴퓨터는 요청한 출력소스이용 모니터로 서버컴퓨터 소통 Linux환경에서 CLI를 이용하기 프롬포트(prompt) 키보드의 입력을 확인,편집하는 한 줄의 공간 터미널은 CLI이다. CLI 명령어 pwd(print ..
레이아웃 각각의 요소를 목적에 맞게 배치 와이어프레임 레이아웃의 뼈대를 그리는 단계 목적 : 화면의 영역 구분 목업 실물 크기의 모형 실제 작동 모습과 동일하게 html문서 작성 *하드코딩 : html문서에 하나하나 입력 Atomic CSS 방법론 클래스 이름과 구현을 1:1로 일치 시킴 , 아주 작은 단위로 css를 작성하는 기법 .so{ height:50%; } 레이아웃 리셋 *{ box-sizing:border-box; } body{ margin : 0; padding: 0; } display:flex 부모요소에 적용 부모요소에 적용해야하는 flexbox 속성들 flex-direction : 정렬 축 정하기 아무것도 설정 X : 기본적으로 자식요소들을 가로 정렬 row(기본값) : 가로 정렬 col..
css은 사용자 경험을 제공하는 도구 사용자 인터페이스(UI): 일반사용자가 쉽게 사용할수 있도록 인터페이스 사용자 경혐(UX) :사용자 경험 CLI :개발자들이 애플리케이션과 소통하기 위해 키보드로 작성한 암호눌러서 동작시킴 프론트엔드 개발자 역할 : 애플리케이션과 소통에 필요한 UI이 제작 컴포넌트 기능별로 묶어서 제작 레이아웃 디자인 타이포그래피와 색상 적용 셀렉터 body { color: green; 선언 속성명 : 속성값 ; 선언구분자 } 선언블록 css 연결 -> link요소 : hrml파일과 다른 파일을 연결하는 목적으로 사용 rel속성 : 파일의 특징 href 속성: 파일의 위치 css 스타일 적용 1.인라인 스타일 2.내부 스타일 시트 3. 외부 스타일 시트 기본적인 셀렉터 id로 이름 ..
html기초 html: 프로그래밍 언어 X , 웹 페이지의 뼈대를 구성하는 마크업 언어 트리구조 자주 사용하는 html 요소 div 태그는 한줄 차지 span 컨텐츠 크기만큼 차지 img 이미지 삽입 닫는 테그 없음 a :링크 삽입 ul,li :리스트 input ,textarea : 다양한 폼 input type에서 radio 다수개중 하나 -> A B A B checkbox는 여러개 선택 textarea :줄바꿈이되는 입력폼 로그인 로그인 시맨틱 요소란? 의미를 가진 요소를 사용하는 방식 , 의미적 가치 X 의미적 가치O 1. 검색 엔지이 시맨틱 요소를 중요한 키워드로 고려 2. 여러개발자가 의미있는 코드 찾는게 더 유용 시맨틱 종류 : 독립적인 콘텐츠 : 중요하지 않은 부분 설명 : 아랫부분 위치 :..
1 코드 기초 StackBliz로 코드 실행 1. terminal에서 node index.js 입력 2. node 입력하면 REPL사용 종료할려면 .exit 입력 용어정리 *REPL : 컴파일 과정 없이 즉석에서 코드를 입력해 결과를 바로 알수 있는 방식 2 타입 number타입 :숫자로 정수와 실수 모두 표현 Math 내장 객체 Math.floor() : 괄호 안의 숫자를 내림하여 반환 Math.ceil() : 괄호 안의 숫자를 내림하여 반환 Math.round() : 괄호 안의 숫자를 반올림하여 반환 Math.abs() : 괄호 안에 숫자를 절대값을 반환 Math.sqrt() : 괄호 안에 숫자의 루트값을 반환 Math.pow() : 괄호 안에 첫번째 숫자를 밑,두번째 숫자를 지수인 숫자로 반환 st..