본문 바로가기
728x90

분류 전체보기302

[HTML/CSS] Flex 활용방법 [HTML/CSS] Flex 활용방법 플렉스는 정렬을 위한 CSS 도구이다. 줄을 바꾸어 배치할 지 등을 선언하고, 내 마음대로 위치를 바꾸어 쓸 수 있다. 예전에는 float를 어떻게 해서 XX발광을 하면서 코드를 스파게티로 만들었다가 씻어서 짜장면으로 만든 다음에 짜장 튀김을 만드는 과정을 겪고 크기가 다른 사진들을 아주 보기좋게 가운데에 차례로 정렬한다던지 했는데, 플렉스는 그게 필요없다. 모든 요소들이 다 들어가있다.사진 1개만 특별한 위치에 가있다던지 하는 것이 가능한 것이다. (align-self) (처음 나왔을 때 프론트 개발자들은 저러지 않았을까...) 아래에서 활용법을 자세히 알아보자. Flexible box 레이아웃 배치 전용 기능으로 고안되었다. display: inline-block.. 2022. 6. 26.
[HTML/CSS] SPA가 무엇인가? [HTML/CSS] SPA가 무엇인가? react, vue, angular 등 요즘 핫한 프레임워크 들이 많다. 동적 웹을 구현할 때 사용하는 도구들이다. 하나의 페이지를 가지고 동적으로 화면이 바뀌면 서버에서 어떤 화면을 클릭해서 탭을 넘기지 않아도, 유려하게, 즉각적으로 반응하는 UI를 만들 수 있다. 그럼 모두 SPA를 쓰면 되지 않을까? 실버 불렛은 없는법,,, 장단점을 알아보자! SPA(Single Page Application) 어떤 웹 사이트의 전체 페이지를 하나의 페이지에 담아 동적으로 화면을 바꿔가며 표현하는 것. 무엇인가를 클릭하거나 스크롤하면, 상호작용하기 위한 최소한의 요소만 변경이 일어난다. 복잡한 UI 구현 시에 사용한다. react, vue, angular가 SPA 프레임워크로.. 2022. 6. 26.
[HTML/CSS] 드롭다운 2차메뉴 만들기 [HTML/CSS] 드롭다운 2차메뉴 만들기 홈페이지를 들어가보면 메뉴 탭에 마우스를 가져가면 하위 메뉴가 아래로 내려가면서 보이는 탭이 있다. 위의 메뉴는 디자인이 되지 않아 볼품없지만, 오늘 다룰 코드들을 활용해서 모든 페이지들이 만들어진다고 보면된다. 자바스크립트를 이용해서 더 유연하게 내려온다던지 하는 것을 아래의 코드들을 변형 또는 발전시켜서 만드는 것이다. 아래에서는 html과 css만 사용해서 메뉴를 구현하였다. 코드들을 살펴보자. 1. html 구성 1차 메뉴 아이템 1 2차 메뉴 아이템 1 2차 메뉴 아이템 2 2차 메뉴 아이템 3 1차 메뉴 아이템 2 2차 메뉴 아이템 1 2차 메뉴 아이템 2 2차 메뉴 아이템 3 1차 메뉴 아이템 3 2차 메뉴 아이템 1 2차 메뉴 아이템 2 2차 메.. 2022. 6. 26.
[C언어] 데이터 타입별 메모리 크기 [C언어] 데이터 타입별 메모리 크기 메모리 관리는 아주 중요하다. 변수에 담고자 하는 값의 크기에 따라 변수의 타입을 선언해주는 것이 좋다. 속도에 있어서 민감하기 때문이다(그렇지만 요즘은 기술이 워낙 발달해서 대충.. 쓰기도 한다고...). 아무튼 타입별 메모리 크기를 알아야 많은 에러에서 벗어날 수 있다. 더불어 다른 언어도 이와 메모리 크기, 이름은 같거나 비슷하니 여기서 알아놓으면 된다. 아래에서는 자료형 별로 차지하는 메모리의 크기를 알아볼 것이다. 1) 정수형 타입 정수형 자료형 크기 자료형 값의 범위 char 1byte -128이상 +127이하 short 2byte -32,768이상 +32,767이하 int 4byte -2,147,483,648이상 +2,147,483,647이하 long 4.. 2022. 6. 25.
[C언어] char 타입으로 배열 만들기 [C언어] char 타입으로 배열 만들기 char 형식은 -128부터 127까지의 정수를 표현할 수 있는 정수 형식이다. char 형식은 문자 하나를 표현할 때 많이 사용한다. 형식 지정자는 ‘%c’이다. char 자료형은 1바이트로, 한 글자만 저장된다. 여러 글자를 담기 위해서는 배열을 이용해야 한다. ex) char a = ‘ab’; => b만 변수에 담기게 된다. int i = ‘a’ 도 된다. ‘a’가 아스키코드로 값이 97이기 때문이다. 여러 글자를 변수에 담기 위해서는 char ch[5] = {‘a’, ‘b’, 0, ‘c’, ‘d’}; 이런 식으로 문자를 담아야 한다. c에서는 끝을 알려주는 것이 0인데, 컴퓨터가 0을 보면 문자열의 끝이라고 인식하게 된다. (c, d)는 출력되지 않는다. .. 2022. 6. 25.
[Web] IP란 무엇인가?(공인, 사설, 고정, 유동) [Web] IP란 무엇인가?(공인, 사설, 고정, 유동) 1. IP란? 컴퓨터가 연결된 네트워크의 끝단의 주소. 기기가 인터넷에 접속한 곳의 네트워크상 위치이다. 그렇기 때문에 아이피는 바뀔 수도 있다. 컴퓨터가 트레일러이면, 아이피는 이 트레일러가 자리잡은 곳의 도로명 주소이다. 이동할 때 아이피가 바뀌지만, 가만히 있어도 바뀌기도 한다. 그 이유는 다음과 같다. 우리는 IPv4형식의 ip를 쓰고 있다. ~~~.~~~.~~~.~~~ 이런식으로 세 자리수가 4번 반복되는 숫자들을 가지고 주소를 부여하고 통신을 진행하는 것이다. 이렇게 하면 42억여 개 정도의 주소가 만들어지는데, 지금 인구와 가지고 있는 스마트기기를 생각해보면 턱없이 부족하다. 그래서 사람들은 하나의 ip 개념을 더 생각하는데, 공인 i.. 2022. 6. 25.
728x90

티스토리툴바