AI 솔루션 개발자과정(Java, Python)
-
30일차 - 자바 스크립트 기본 문법 (3)AI 솔루션 개발자과정(Java, Python) 2022. 11. 18. 17:54
객체 리터럴 객체를 구성하는 속성(값이나 기능)의 이름과 실제 값을 한 쌍으로 묶어 표현하는 ‘객체 리터럴’을 이용하면 객체를 생성할 수 있다. 이때 속성의 이름을 키(key), 속성의 실제 값을 밸류(value)라 한다. cname과 cage은 키, "나비"와 3은 밸류이다. 속성의 밸류로 함수가 주어지면, 이 속성은 메소드가 된다. 객체 안의 속성 값을 참조할 때는(읽거나 쓸 때는) 도트(.) 연산자 또는 대괄호([]) 연산자를 사용할 수 있다. 스프레드 연산자(전개 구문) 스프레드 연산자를 사용하면 배열이나 객체 리터럴 등의 요소 목록을 펼칠 수 있다. 전개 구문, 전개 연산자 등으로 불린다. (펼치다 = spread) 스프레드 연산자 = ... 스프레드 연산자는 배열의요소를 복사할 때 효과적으로 ..
-
29일차 - 자바 스크립트 기본문법(2)AI 솔루션 개발자과정(Java, Python) 2022. 11. 17. 17:53
삼항 연산식 삼항 연산은 이름 그대로 세 개의 항을 이용해 결과를 반환하는 연산이다. 보통 if문의 단축 형태로 사용되기 때문에, 삼항 조건 연산식이라고도 부른다. 조건식 : 조건 역할을 하는 표현식 참일_경우의_결과 : 조건식의 결과가 참일 경우 반환될 결과 거짓일_경우의 결과 : 조건식의 결과가 거짓일 경우 반환될 결과 생성자 생성자란 객체를 생성할 때 사용하는 함수로서, ’생성자 함수’라고도 한다. 사용할 기능을 정의한 일반 함수와 생성자 함수 사이에 특별한 문법적 차이는 존재하지 않는다. 즉, 함수는 생성자 역할을 할 수 있다. 단, 생성자 함수는 객체생성을 목적으로 만드는 것이다. 생성자를 사용한다면 자바스크립트가 제공하지 않는 유형의 데이터를 창조할 수 있다. 생성자 함수 정의 시 this 키..
-
28일차 - 자바 스크립트 기본 문법 (1)AI 솔루션 개발자과정(Java, Python) 2022. 11. 16. 17:34
자바 스크립트 자바 스크립트는 프로그래밍 언어이다. 자바 스크립트는 서버 개발, 어플리케이션 개발 등 다양한 목적을 위해 사용할 수 있는 언어이지만, 주된 활동 분야는 웹 개발 이다. html로 콘텐츠를 정의하고, css로 스타일링하여 java script로 어떤 동작을 하고 상호작용을 할지 정의한다. 웹 사이트 개발에 있어, 자바 스크립트의 역할은 웹 브라우저가 가진 기능을 실행 시키거나 HTML / CSS 를 통해 렌더링된 화면을 조작할 수 있다. 웹 페이지에 자바스클비트를 더하는 방법은 두 가지 방법이 있다. HTML문서 내부에 작성하기 자바스크립트 파일을 만들고, 그 안에 작성한 코드를 HTML 문서에 연결하기 html문서에 작성할 때 스크립트는 바디의 하단에 들어간다. 소스를 통해서 스크립트를 ..
-
26일차 - 반응형 웹, 플렉스 박스와 그리드 레이아웃AI 솔루션 개발자과정(Java, Python) 2022. 11. 14. 17:23
반응형 웹 반응형 웹이란, 다양한 기기나 브라우저의 크기에 맞게 구성이나 크기를 변경해 가며 반응하는 웹문서 또는 이를 위해 사용하는 기법을 뜻하는 말이다. 스마트 모바일 기기의 등장으로, 데스크톱 화면을 위해 존재했던 웹문서의 설계에도 변화가 요구되기 시작했다. 변화의 초기에는 모바일 전용 URL을 제공 하는 방법이 주로 사용 되었다. 태블릿, 스마트 워치, 자동차 (네이버처럼)모바일 환경과의 격리가 성공적으로 정착한 사례도 물론 있지만, 기기의 유형이 갈수록 다양해짐에 따라 한계를 드러낼 수밖에 없다. 기기에 최적화된 콘텐츠를 계속해서 생산해내는 것은 현실적으로 어렵기 때문에, 사용하는 기기에 적절하게 맞춰지는 사이트를 개발하는 것이 바람직하다. 즉 반응형 웹사이트를 만드는 것이 좋다. 그리고 반응형..
-
25일차 - CSS / flexbox, 선택자, 의사 클래스, 의사 요소, 상속과 공용 키워드, z-index, %와 미디어 쿼리, 변형과 전환, 애니메이션AI 솔루션 개발자과정(Java, Python) 2022. 11. 11. 17:11
레이아웃을 유연하게 flexbox flexbox 란 박스 내 요소 간의 공간 배분과 정렬 기능을 제공하기 위한 1차원 레이아웃 모델이다. flexbox 를 1차원 모델이라 부르는 이유는, 레이아웃을 다룰 때 한 번에 하나의 차원(행이나 열)만을 다룬다는 특성 때문이다. flexbox 만들기 flexbox를 flex 컨테이너라고도 한다(요소들을 포함하기 때문이다). flex 컨테이너를 만들기 위해서는 컨테이너에 display:flex; 를 적용해야 한다. flexbox에는 ‘주축(main-axis)’과 ‘교차축(cross-axis)’이 있다. flex-direction flex-direction 속성은 flexbox 내 요소를 배치할 때 사용할 주축 및 방향(정 방향, 역방향)을 지정한다. flexbox를..
-
24일차 - HTML 마무리(뷰포트, 시맨틱 태그, 미디어 태그), CSS 선택자, 텍스트 관련 속성, 박스 모델, 부동 요소AI 솔루션 개발자과정(Java, Python) 2022. 11. 10. 17:07
뷰포트(viewport) 뷰표트(viewport)란 현재 화면에 보여지고 있는 영역을 의미한다. 기기 별로 뷰포트가 다르기 때문에, 동일한 웹 페이지라도 기기에 따른 배율 조정이 발생해 화면의 크기가 다르게 보이는 현상이 나타난다. 동일한 HTML 문서를 각각 pc와 모바일로 확인한 결과이다. 태블릿, 스마트폰 등 모바일 기기가 등장하기 전에는 웹 페이지가 컴퓨터 화면 만을 위해 설계 되었다. 컴퓨터 화면에서의 웹 페이지는 웹브라우저라는 소프트웨어를 통해 페이지 크기를 조절해가며 웹을 조회할 수 있지만, 모바일 기기에서는 고정된 사이즈(스크린 크기)로 조회해야 하므로 웹의 모든 콘텐츠를 표시하기 위해서는 배율 조정 을 해야만 한다. 때문에 PC용 웹페이지와 모바일 웹페이지를 따로 만드는 경우도 있다. 기..
-
23일차 - 프론트 엔드 HTML 문단, 태그, 속성, 컨테이너, 전역 속성, 링크, 타겟, 목록, 입력, 폼(form)AI 솔루션 개발자과정(Java, Python) 2022. 11. 9. 12:17
웹 개발 - 프론트 엔드 : 사용자에게 보여지는 부분. ex) 네이버 다음 홈페이지 => HTML, CSS, 자바 스크립트 - 백 엔드 : 사용자들이 이용할 수 있는 정보를 보관.관리하는 부분. ex) 데이터 서버 => 자바, 파이썬, Golang 선택 가능 HTML HTML은 HyperText Markup Language를 의미한다. •HyperText : 하이퍼링크를 통해 어떤 문서에서 다른 문서로 접근할 수 있는 텍스트 •Markup : (콘텐츠를) 표시하다 •Language : 언어 HTML은 웹브라우저를 통해 표시되는 웹페이지의 콘텐츠를 정의하기 위해 사용하는 언어이다. HTML은 웹페이지의 콘텐츠를 정의하기 위해 사용하는 언어이다. 개발자는 HTML 코드로 웹페이지에 어떤 내용이 표시될지를 정..
-
22일차 - 문자 스트림, 파일 시스템, NIO, 쓰레드AI 솔루션 개발자과정(Java, Python) 2022. 11. 8. 15:08
문자 스트림의 이해와 활용 바이트 스트림과 문자 스트림의 차이 문자를 입출력할 때에는 약간의 데이터 수정이 필요하다.(인코딩) 그래서 자바에서는 ‘문자 스트림’ 이라는 것을 별도로 지원한다. (이 스트림은 데이터 수정을 자동화 해준다.) FileReader & FileWriter FileReader 작성되어 있는 파일을 읽어들인다. FileWriter 파일을 작성한다. BufferedReader & BufferedWriter I/O 스트림 기반의 인스턴스 저장 ObjectInputStream & ObjectOutputStream 파일 시스템 기본적인 파일 시스템 절대경로, 상대경로 Paths와 Path 클래스 get 메소드들은 경로를 출력하기보단 표시한다. 경로를 인스턴스화 해서 참조만 한다. 파일 및 ..