전체 글(355)
-
[Kubernetes] docker 와 minikube container 실행
앞서 가상 머신 환경인 minikube를 설치하고 그곳에서 앞으로 시스템을 구축하고 운영하기 위해 설치 및 세팅을 완료했습니다. 이제 minikube를 실행하고 그 안에서 특정 image를 실행해보도록 하겠습니다. !! 그 전에, 이 과정은 제가 따로 공부하면서 참고하고 있는 특정 개발자분이 만드신 내용들을 참조하고 있다는 것을 밝힙니다. 참고하고 있는 개발자 분이 만드신 image를 github에서 일부분 우선 확인해보았습니다. 그 중에 Dockerfile 이라는 파일을 확인해보겠습니다. 이 안에 제가 image 안에 포함하고 싶은 것들을 모두 기입합니다. 위의 예시 Dockerfile은 github 사이트에서 예시로 가져온 내용입니다. 해당 Dockerfile 내용 중 일부만을 사용할 것인데, 내용을..
2023.06.26 -
[Kubernetes] docker 와 minikube 초기 세팅
minikube 는 docker 의 편집판이라고 볼 수 있습니다. minikube 안에는 docker가 설치되어 있습니다. 따라서, docker 에 접속해서 설치한 minikube 가상 머신을 통해 그 속에 있는 docker를 사용하여 시스템을 운영할 것입니다. 이전에 minikube 설치가 이미 완료가 되었다는 가정 하에 minikube 초기 세팅 과정을 정리해보겠습니다. minikube 가 설치되어 있지 않다면 이전에 정리한 방법대로 설치를 우선적으로 하고 설치가 되어있다면 minikube start 명령어를 입력해줍니다. 실행되는 데는 어느 정도의 시간이 걸립니다. minikube docker-env 명령어를 입력하여 어떤 환경 변수들을 설치해야 docker command line으로 minikub..
2023.06.26 -
[CSS] 반응형 CSS - Media Queries
반응형을 만들기 위한 방법 중 하나인 Media Query 에 대해 좀 더 정리해보겠습니다. @media(max-width: 600px){ h1{ font-size: 15px; } } Media Query 는 위와 같은 양식으로 반응형을 구현합니다. selector 대신에 @ 기호와 media 키워드를 입력하고, (괄호) 안에 조건을 기입합니다. 중괄호에는 조건에 부합할 경우에 적용될 CSS 동작 코드를 입력하게 됩니다. 괄호 안에 들어갈 조건은 다양하게 넣을 수 있습니다. min-width 와 같이 최소 넓이에 관련된 내용의 조건을 넣거나 할 수 있다는 뜻이죠. max-width를 조건으로 걸 경우 오른쪽에서 왼쪽 방향으로 넓이를 파악하고, min-width를 조건으로 걸 경우 왼쪽에서 오른쪽 방향으로..
2023.06.24 -
[CSS] 반응형(Responsive) 웹 사이트 만드는 방법
개발한 웹 사이트가 플랫폼 환경에 따라 화면 구성이 동적으로 반응하여 적용될 수 있어야 합니다. 모바일, PC, TV, pad 등 다양한 환경에서 한 가지의 일관된 형식으로 화면이 보여지게 되면 사용하는 클라이언트 입장에서도 많이 불편하기 때문입니다. 따라서 반응형 웹 사이트는 현대 웹 개발에 필수라고 볼 수 있습니다. 이 반응형을 구현하기 위해선 대표적으로 4가지의 방법이 있습니다. 1. Media Queries 2. CSS Grid 3. CSS Flexbox 4. 외부 프레임워크 / 부트스트랩 Media Queries Media Query 예시 코드를 보면 양식은 이렇습니다. 마치 Spring의 Lombok 의 형태처럼 @ 기호와 media 키워드를 사용하고 괄호 안에 조건을 겁니다. 위의 코드의 조..
2023.06.24 -
[CSS] CSS Float / Clear
같은 영역에 서로 다른 타입의 태그 및 내용을 같은 영역을 공유하고 싶다면 float 옵션을 사용합니다. 예를 들어 글 내용 도중에 사진 이미지가 같이 포함이 되어 있고 같은 영역에 배치되어 사용되고 싶다면 이럴 때 float 특성을 사용합니다. 기본적으로 서로 다른 태그를 사용하게 되면 각각의 사용되어 보여지는 display 영역이 다르기 때문에 한 라인씩 해당 태그가 배치되어 보여집니다. float 옵션을 적용하면 같은 display를 공유하게 되면서 적절하게 배치되어 마치 한 라인에 같이 보여지는 것처럼 보일 수 있습니다. 예시 코드 CatCSS Nap all day cat dog hate mouse eat string barf pillow no baths hate everything but kit..
2023.06.24 -
[Kubernetes] 로컬 쿠버네티스 개발을 위한 미니큐브 설치와 쿠버네티스 초기 세팅
kubernetes 를 로컬 환경에서 구현하고 세팅 및 설치하는 과정은 생각보다 많이 어렵다고 알고있습니다. 저 또한 주로 사용하는 노트북 사양에서 하려고 하니 가상 머신에 대한 필요 메모리 양이 생각보다 많아서 노트북으로는 진행하지 못하고 결국에는 회사 데스크탑 컴퓨터를 사용할 수 밖에 없었습니다. 이 어려운 초기 세팅 과정을 정리해보려고 합니다. Hyper V 사용 허용 시작 버튼에 오른쪽 마우스 클릭하고 앱 및 기능을 선택해줍니다. 앱 및 기능에서 프로그램 및 기능을 눌러줍니다. 프로그램 및 기능에서 Windows 기능 켜기/끄기를 선택해줍니다. Hyper-V 항목을 찾아서 체크하여 사용 허용을 해줍니다. Hyper-V 는 kubernetes를 사용할 때 가상 머신 스위치라고 하는 가상의 실행 환경..
2023.06.23