본문 바로가기

공부를 합니다

(84)
WEB2 - JavaScript_5-6 데이터 타입, 변수와 대입연산자 5. 데이터 타입 - 문자열과 숫자 컴퓨터 프로그래밍에서는 데이터를 효과적으로 처리하기 위해 자료형(Data type)을 분류한다. JavaScript에도 data type이 존재한다. Primitive data type: Boolean, Null, Undefined, Number, String, Symbol Objects 이 중 가장 자주 쓰이는 Number과 String을 비교 Number 숫자를 그대로 입력. 연산이 가능하다. Console에 1+1을 입력하면 결과 값으로 2를 반환. document.write(1+1) + 외에도 다른 산술 연산자를 사용해서 계산을 할 수 있다. 1 + 1 → 2 2 - 1 → 1 2 * 4 → 8 6 / 2 → 3 String 따옴표(', ") 안에 "입력..
WEB2 - JavaScript_2-4 HTML과 JavaScript의 만남 2. Script 태그 JavaScript는 HTML을 기반으로 동작한다. JavaScript를 전혀 다른 언어인 HTML과 어떻게 같이 사용할 수 있을까. : JavaScript vs HTML 텍스트는 HTML에 직접 입력해도 사용할 수 있지만 JavaScript가 HTML에 비해 동적으로 수행할 수 있는 여지가 더 많다. 1+1 3. 이벤트 (Event) JavaScript가 사용자와 상호작용하기 위한 핵심기능. onclick의 속성값을 기억하고 있다가 '클릭했을 때' 코드를 실행 위의 '클릭'처럼 웹 브라우저에서 일어나는 일중 대표적인 것을 추려 EVENT라고 한다. Example: onclick - 클릭할 때, onchange - 내용 변화가 있을 때, onkeydow..
WEB2 - JavaScript_1 수업의 목적 1. 수업의 목적 JavaScript를 이용하면 사용자의 행위에 반응하도록 만들 수 있다. (상호작용) 웹 페이지는 브라우저에 한 번 출력되면 바뀔 수 없지만 (e.g. 태그는 계속 태그를 유지) JavaScript를 이용하면 디자인에 변화를 줄 수 있다. Example 사용자가 버튼을 클릭했을 때 웹 페이지의 배경과 글씨 색을 바꿀 수 있다. night button: 배경 검정색, 글씨 흰색 day button: 배경 흰색, 글씨 검정색 input type = "button" value = "night": 글씨가 night이 써진 버튼 생성 onclick: 클릭했을 때 속성값을 실행, 속성값으로 JavaScript를 갖는다. document.querySelector('body'): 웹 페..
[생활코딩] WEB2 - JavaScript 강의소개 생활코딩 에서 제공하는 JavaScript 강의. JavaScript 학습을 시작하기 위해 선택했다. 강의주소: https://opentutorials.org/course/3085 수강기간: 2020.04.29 - 2020.05.07 수강 소감 강의 자체는 입문용으로 매우 좋았다고 생각한다. JavaScript가 어떤 느낌인지를 확실히 할 수 있었던 강의였다. 다만 아쉬웠던 점은 강의에서 전반적인 프로그래밍 언어에 대한 내용이 차지하는 부분이 꽤 됐는데 이미 다른 언어로 대략적인 개념을 배운 뒤 듣다보니 지극히 개인적으로 효율이 떨어졌던게 좀 아쉬웠다. 메인 강의에서는 객체 빼고는 크게 새로 배운게 없는 느낌. 다음 강의를 들어봐야 확실히 알겠지만 다른 프로그래밍 언어를 배웠다면 바로 생활코딩의..
생활코딩 CSS_13 라이브러리(Library) 13. 라이브러리 (Library) Fontello 특정 문자에 해당하는 이미지로 이루어진 폰트를 제공하는 사이트. 원하는 아이콘을 선택한 뒤 (여러개 선택 가능) Download webfont를 누르면 다운로드 선택 내역은 config.json 파일에 저장되고 선택 내역이 초기화 됐을 때 설정을 눌러 이 파일을 업로드하면 목록을 다시 불러올 수 있다. svg 파일을 받아서 사이트에 drag & drop 하면 나만의 아이콘 폰트를 만들 수 있다. demo.html을 열어 다운받은 아이콘 리스트를 확인 show codes를 누르면 각 이미지의 문자 값 (i.e. unicode)를 보여준다. 이 값을 복사해서 부분에 붙여 넣어 사용 할 수 있다. 아이콘을 사용하려는 html파일에 fontello.css를 링..
선형대수(HYU)_09 선형변환과 행렬 2.6 Linear Transformations Ax = b를 보는 여러가지 관점 System equation. x는 solution. b는 A의 column vectors의 linear combination. x는 linear combination의 coefficient. x가 A system에 의해 b로 변환(transform)됨 $\leftarrow$ New! 임의의 m x n matrix A가 있을 때 $Ax = b$는 A를 통해 n차원의 vector x를 m차원의 vector b로 transform 시키는 것으로 볼 수 있다. 이 때 $A(a_1x_1+a_2x_2)=a_1Ax_1+a_2Ax_2$를 만족하므로 linear transform이다. Examples $A=\begin{bmatrix} c..
CS50's Week 7_SQL 7. SQL Spreadsheets Database는 데이터(data)를 저장할 수 있는 application으로 Google Sheets 등이 이에 해당한다. 예를들어 학생들에게 좋아하는 TV show와 장르를 물어보는 Google Form을 만들어 응답을 수집한 뒤 확인하면 spreadsheets는 다음과 같은 세 개 열의 데이터를 갖는다: "Tilestamp", "title", "genres" 이를 CSV 파일로 다운받아 python으로 데이터를 분석하는 프로그램을 작성할 수 있다. 1. 파일을 열어 각 행의 TV Show 제목을 출력 # csv library를 import import csv # filename.csv를 read 모드로 열어 file에 저장 with open("filename.cs..
생활코딩 CSS_12 유지보수 12. 유지보수 12.1 Link와 Import 동일한 css가 적용된 웹 페이지가 여러개일 때, 수정사항을 일괄적으로 적용할 수 있도록 해줌 여러개의 웹 페이지에 중복된 css가 있을 때, 중복된 코드를 별도의 css파일 (e.g style.css)를 따로 작성한다. link나 import를 이용해서 웹페이지가 style.css를 다운받아 적용할 수 있도록 한다. 링크로 style.css를 걸어놓은 모든 문서는 style.css만 수정하면 일괄적으로 수정된다. 12.2 코드 경량화 (minify) 서버와 클라이언트 사이의 데이터 이동을 줄이기 위해 코드의 불 필요한 부분을 줄이는 것 코드를 minify 해주는 다양한 도구들이 있고 대표적으로 clean-css를 많이 사용한다. clean css를 이용하..