공부/오늘 배운것

22.09.21-논리 구조 설계 및 시각화의 중요성

Doil98 2022. 9. 21. 17:51

오늘의 요약=논리 구조 설계 및 시각화

1.

  • css flex attribute review
  • div 는 내용물에 따라 높이가 결정
  • grid-templete-colums과row 로 행과 열을 정의할 수 있다.

2.

  • css

3~4

  • media query
    • 미디어 장치에 따라서 변하는 것

5.

  • media query
    • 설계를 잘해야한다.
    • 모든 기기 마다 각각 해상도가 다르다.
    • 사이즈 따라 어떻게 나타낼지 기준을 정한다.
    • 내용의 양이 많고 어렵다.
    • @ media screen or all 사용

6.

  • js 설정
  • eclipse workspace 변경시 설정 초기화
  • 프로젝트 처음 생성시 라이브러리에 자바랑 서버가 활성화 되어있는지 확인
  • http 포트번호만 바꿔줘라
  • (document).ready(function):body먼저 해석하고 자바를 실행해주세요.
    • 안 쓰려면 스크립트 태그를 바디 밑에 넣으면 프로그램대로 된다.
    • 컴퓨터는 위에서 아래로 순차로 처리하니까.
  • 이분화 된다.
    • script를 head 안에 넣자 vs body 밑에 넣자.
    • 장단점있다.

7.

  • // js 주석
  • 브라우저에서 동작하는 유일한 프로그래밍 언어다.
    • 브라우저가 js 번역기(컴파일러)를 포함하고 있다는 의미.

프로그래밍 언어 개요

  • 언어: 정해진 규칙과 약속(문법)에 맞게 작성한다. (텍스트)
  • 각 언어마다 정해진 약속이 다르고, 특징이 다 다르다.
  • 특징에 따라서 용도 가 구별이 된다.
  • 프로그래밍 언어 = 컴퓨터에게 동작을 지시하는 것
  • 일반적인 언어는 사람이 이해 할 수 있는 구조를 가짐(high-level)
  • 기계가 이해할 수 있는 방식으로 번역해줘야한다.(interpreter) java-> jdk.
  • js 언어는 작동하기 위해서 기계어로 번역되어야한다.
  • 기존의 경우는 이 번역기 를 설치해줘야하는데, js 번역기는 브라우저에 내장되어있다.

기계어 번역 방식 크게 2개로 나뉜다.

  • 인터프리터 : ex) js,python,visualBasic,R언어
    • 특징: 속도가 느리다.변수 자유도가 높다(타입에 유연하다).
    • 하드웨어가 동작할 때 바이너리 코드로 변경되서 실행하고,
      바이너리 코드가 독립적인 파일로 만들어 지지 않는다.
  • 컴파일 : ex) C ,Cobol, c++,pascal,fortran,delphi...
    • 참고: 컴파일 결과로 binary코드가 생성된다.
  • 컴파일-인터프리터 방식 : java
    • 참고: 컴파일 결과로 바이트코드가 생성된다. 이 바이트 코드를 인터프리트 해서 동작한다.

레벨

  • high
  • 컴파일러 인터프리터
  • pascal
  • c,c++ midle level
  • Assembly
  • low
    • 로우레벨이 어려운 이유는 cs를 모르기 때문에.
      컴퓨터의 세계를 모르는데 어찌 이해를 할 수 있는가.

tip

필요한 자료는 보관한 후에 사용을 한다 == data를 var(변수)에 넣어라. (beginner tip).
let num(); = Variavle(변수)선언.
변수의 계산값을 변수로 담는다. (변수 안에 변수) 變數(변할 변, 셈 수).

  1. 명령 과 자료를 구분
  2. 자료는 변수에 대입해라
  3. 변수 를 명령 처리

js 에서 문자열은 '',"",``,이다

java(맛보기)

  • '' 글자 한자
  • ""문자들의 묶음 0개 부터

정리

프로그래밍 언어를 배운다는 것 그것의 특징과 문법을 배우는 것이다.
진정한 의미의 프로그래밍은 언어를 잘다루는 것 보다

더 중요한것은 논리 구조 설계 및 시각화 이다.

본질(논리 구조 설계 및 시각화)+도구(프로그래밍 언어)

8.

+ (2개의 항을 연산한다 = 이항연산자)

  • 숫자 타입은 더하기
  • 문자 타입은 연결하기
  • 부호 유지 ex ) +(-3)

data 와 연산자를 구분

  • 변수는 let 과 var 을 사용한다.
  • 변수와 탐색기의 연관 관계가 무엇이냐?(번외)
  • var은 가급적 지양

a = 2 :2를 a 에 넣어라 = 주입하라[injection],옮겨라[move],할당하라[assign]

==,=== : 표현이다. 수학적으로 같다는 뜻.

변수 목적

  • 저장
    • 변수가 왼쪽 == 저장 목적
  • 꺼내기
    • 그 외는 꺼내기 목적
    • var1 = var2 + var3 === var2 와 var3의 값을 꺼내서 연산한 값은 var1에 저장한다.

배운 명령 let

  • 변수 선언 값.

지식이 고착화 되지 않게 주의해라.