본문 바로가기

분류 전체보기

 (120)
AWS 과금 문제 해결 1 (USD 0.095 per GB-month of backup storage exceeding free allocation) 프리티어가 만료된다 메일이 왔길래 결제 대시보드 확인하러 들어갔더니 청구가 되고 있었다. 그래서 자세한 내역부터 확인해봤다. 우선 첫번째는, 이 backup storage다.  이게 뭘까 싶어서 USD 0.095 per GB-month of backup storage exceeding free allocation 이걸 검색어에 그대로 옮겨붙여 검색해봤더니 어느 분이 블로그로 친절하게 설명해주고 계셨다.  사용했던 데이터베이스를 삭제하며 스토리지(storage) 백업이 생성되지 않도록 설정값을 체크해야 하는데 안해서, RDS-스냅샷 부분에 백업이 되있던 거였다. 바로 삭제!
[HTML/CSS] 04. CSS 박스 모델 🔍 inline과 block 방식 div와 span의 또 다른 차이점은, div와 달리 span 태그는 너비와 높이를 가지지 않는다는 것이다. span은 inline 태그로 안에 content가 없으면 너비와 높이를 가지지 않는다.그래서 span은 텍스트를 입력하는데만 사용되며 대부분의 작업은 div가 사용된다.display: inline; // 인라인 방식으로 변경display: block; // 블록 방식으로 변경 이 display 속성에 inline, block 등 값을 줘서 어떻게 동작할지 방식을 바꿔줄 수 있다.   🔍 CSS의 박스모델Contents : 콘텐츠 영역으로 텍스트 및 이미지의 실제 영역.Padding : 테투리와 콘텐츠 사이의 안쪽 여백.Border : 박스를 둘러싼 테투리 영..
[HTML/CSS] 03. HTML에 CSS를 적용하는 3가지 방법 🔍 1. 인라인 스타일HTML 요소에 직접 style 속성을 사용하여 CSS를 적용하는 방법 간단하고 원하는 특정 요소에만 적용 가능하나, 유지 보수가 어렵고 가독성이 안좋다.또, 나중에 여러 css를 작성하다보면 어디에 어떤 스타일을 적용했는지 파악하기 난해해 중복된 코드가 많이 발생하며 스타일을 바꾸기 어렵다.   🔍 2. 내부 스타일 (임베디드 스타일)HTML 문서의 태그 내에  작은 프로젝트에 적합하며, 동일한 문서 내의 스타일을 각 파일별로 관리할 수 있다.그러나 다른 HTML 파일에 재사용이 불가능하며 HTML 파일 안에 CSS가 섞여있어 보기가 어렵다.   🔍 3. 외부 스타일 (링크드 스타일)별도의 CSS 파일을 만들어 HTML 문서에 링크로 연결하는 방법 현업에서 가장 많이 사용하..
[HTML/CSS] 02. 시맨틱 마크업 (Semantic Markup)이란? 🔍 와  와 은 HTML에서 가장 기본적인 컨테이너 요소로, 각각 다른 용도와 성격을 가지고 있다.This is a A with some text inside.This is a B with some text inside.  : 인라인 태그. : 블록 레벨 요소 span은 옆으로 이어지는 인라인 태그기 때문에 줄바꿈이 발생하지 않지만, 는 한 공간을 차지하기 때문에 줄바꿈 발생하게 된다.   🔍 Semantic 태그란? Semantic 태그는 HTML5에서 추가된 태그로, 웹 페이지의 구조를 더욱 의미론적으로 표현하는 데 사용된다.div와 span 등의 일반적인 컨테이너 태그를 사용하여 웹 페이지를 구성하면, 이 태그들은 그 자체로는 어떤 의미도 가지지 않기 때문에 웹 페이지의 내용을 이해하기 ..
[HTML/CSS] 01. 웹 개발의 시작 🔍 웹 개발의 시작 https://dribbble.com/디자이너 리소스를 구하기 힘들때 이용하는 홈페이지.다양한 웹 디자인을 무료로 제공하며 사이드 프젝를 만들 때 디자인을 참고하자.   🔍 HTML, CSS, JavaScript ◆ 💻 HTML의 기본 구성 웹 페이지 제목 여기에 콘텐츠를 작성합니다.  : 이 문서가 어떤 특징이 들어가 있는지 문서에 대한 설명이 들어가 있다. : 웹 페이지의 제목을 정의, 검색 엔진 최적화(SEO)에 중요한 역할 : 웹 페이지의 메타데이터(저작자 등)를 정의 : JavaScript 코드 : CSS 코드 지정 : 실제 사용자에게 보여지는 내용이 들어간다.  ◆ 💻 CSS란? Cascading Style Sheet의 줄임말.HTML이 골격, 그 골격을 ..
[이론] 02. 프론트엔드와 백엔드, 그리고 API 🔍 프론트엔드란? 사용자가 만나게 되는 웹사이트의 앞단HTML, CSS, JavaScript라는 세 가지 요소로 이루어져있음  🔍 백엔드란? 서버 역할.데이터를 처리, 가공, 저장해서 앞단으로 보내주는 역할이 백엔드.서버 언어(Python, Java, Node.js) 등과 데이터베이스 언어(MySQL, MongoDB) 등으로 이루어져있다.  🔍 API란? Application Protocol Interface의 약자로, 프론트엔드와 백엔드를 연결시켜 주는 역할을 한다.서로 다른 소프트웨어 간에 정보를 주고 받기 위한 통신 규약이다.
[이론] 01. 컴퓨터에 대해 이해하기 🔍 데이터로 이루어진 컴퓨터의 뇌구조  컴퓨터는 우리랑 다른 0과 1의 세계에 살고 있다그래서 컴퓨터적 사고를 통해 도출한 아이디어를 컴퓨터에게 전달.전달된 내용으로 바탕으로 컴퓨터가 효과적으로 일을 수행한다   🔍 컴퓨터적 사고를 하는 법을 의식적으로 수행하자!이 컴퓨터적 사고를 검증하고 평가하기 위한 수단이 코딩테스트다.   🔍 컴퓨터처럼 생각하기 위해선?분해 (Decomposition) 패턴 인식(Pattern Recognition)추상화 ( Abstraction)알고리즘( Algorithms)큰 문제를 작은 문제로 분해해서 패턴을 찾고 추상화 또는 일반화 해서 최종적으로 알고리즘을 도출하는 게 컴퓨터적 사고다.의식적으로 문제를 분해하는 과정을 거쳐보자   🔍 알고리즘이란? 문제를 해결하는 ..
[Python, 파이썬] SWEA 15941. 평행사변형 평행사변형의 변의 길이 N을 받아서 넓이를 구하는 문제.  T = int(input()) # 테스트 케이스의 수 Tfor test_case in range(1, T+1): N = int(input()) # 정수 N print("#%d %d" %(test_case, N*N))  설명이... 필요한가?이게 왜 D3지?

티스토리툴바