본문 바로가기

전체 글74

[Django] 24.02.20 Django에 대해서 드디어 Django 강의가 시작되는 날이다. 오늘은 Setting 부터 간단한 실습까지 진행했다. 1. Django란 Django는 파이썬으로 작성된 오픈 소스 웹 프레임워크로, 모델-템플릿-뷰(MTV) 패턴을 따르고 있다. Django는 웹 애플리케이션을 개발할 수 있는 무료 오픈 소스 웹 프레임워크다. 웹 프레임워크라는 것은 웹 개발에 필요한 요소를 미리 만들어 사용자들이 쉽고 빠르게 웹 애플리케이션을 만들 수 있게 도와주는 도구이다. 또한 프레임워크 규칙이 잘 정리되어 있고 배우기 쉬우며 개발 문서 자체가 잘 마련되어 있어 웹 개발에 익숙하지 않은 사람들도 쉽게 따라할 수 있다. 2. Django 특징 1. ORM(Object-Relational Mapping): 데이터베이스와 상호작용을 자동화하여.. 2024. 2. 20.
[FrontEnd] 24.02.19 Bootstrap 과 Tailwind 한 주의 chatGPT를 활용한 개인 프로젝트 기간이 끝나고 Django 강의를 시작하기 앞서 웹 개발을 더욱 쉽고 빠르게 할 수 있는 두가지 방법을 배웠다. 1. 부트스트랩(Bootstrap) 부트스트랩이란 프론트엔드 개발을 빠르고 쉽게 할 수 있는 프레임 워크로 각종 레이아웃, 버튼, 입력창 등의 디자인을 CSS와 JavaScript로 만들어 놓은 것이다. 사용자의 시점에 맞춰 최적화 되어 화면을 구성하고 반응형 사이트를 구축하기에 최적화 되어있다. 버튼, 이미지, 목록 뿐 아니라 메뉴바, 알림 메시지 등 웹 페이지에서 많이 쓰이는 요소를 전부 내장하고 있기 때문에 개발자 입맛에 따라 재사용 할 수 있다. 따라서 대부분 모든 웹페이지를 미리 지정된 CSS와 JavaScript의 활용으로 빠르게 만들 .. 2024. 2. 19.
[JavaScript] 24.02.05 JavaScript에 대해서(2) this this 란? 객체를 가리키는 참조 변수로, 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수이다. this는 함수가 만들어질 때가 아닌 "실행"될때 그 값이 결정된다. this가 가리키는 대상은 어떻게 this가 호출되는지에 따라 다르다. 아래 상황별로 this의 의미를 나눌 수 있다. 전역 공간에서의 this 메서드로서 호출할 때 내부에서의 this 함수로서 호출할 때 내부에서의 this 콜백 함수 호출 시 내부에서의 this 생성자 함수 내부에서의 this this를 전역에서 사용한 경우 브라우저라는 자바스크립트 런타임의 경우에 this는 항상 window라는 전역 객체를 참조한다. 전역 객체란 전역 범위에 항상 존재하는 객체를 의미한다. 브라우저라는 자바스크립트 런.. 2024. 2. 5.
[JavaScript] 24.02.02 JavaScript에 대해서 JavaScript 자바스크립트는 ‘웹페이지에 생동감을 불어넣기 위해’ 만들어진 프로그래밍 언어로 해당 언어를 사용하여 정적이던 웹을 동적인 웹으로 만들 수 있게 되었다. 즉 HTML 페이지를 동적으로 만들어 주는 것이다. 왜 자바스크립트인가? 자바스크립트의 원래 명칭은 ‘모카’(Mocha)에서 ‘라이브 스크립트’(LiveScript)로 변경되었다가 최종적으로 ‘자바스크립트’(JavaScript)가 되었습니다. 라이브스크립트가 출시 될때 쯤, 당시에 인기있던 언어중에 ‘자바’ 가 있었는데 이 인기를 이용하고자 이름만 빌려와 자바스크립트가 되었습니다. HTML : 웹페이지의 구조를 만들어준다. (마크업 언어) CSS : 웹페이지에 디자인을 입혀준다. (스타일 규칙 언어) JavaScript : 웹페이지가 .. 2024. 2. 2.
[CSS] 24.01.31 Position, Flex 오전시작으로는 어제의 실습 문제를 다시 풀어보는 시간을 가졌다. 여러번의 프론트엔드 프로젝트를 진행해본 경험이 있어서 쉽게 작성할 것이란 생각으로 시작했지만 시간내로 작성하기 위해 엉망으로 작성한 코드들이 부끄럽기도 했고, html의 요소들의 특징이나 css의 사용법을 정확하게 알지 못하고 작성하니 출력 화면에서 표현되는 요소들의 배치나 스타일 등 여러가지가 문제였지만 어찌어찌 제출을 완료했고 강사님이 작성해주시는 코드를 보며 다시 한번 부족한 부분을 확인하는 시간이었다. 1. position position이란? HTML 태그의 위치를 지정해주는 속성이다. 요소의 정확한 위치 지정을 위해서 top, left, bottom, right 속성과 함께 사용된다. 2. position 종류 2.1 positi.. 2024. 1. 31.
[CSS] 24.01.30 CSS 기본 CSS란 CSS는 Cascading Style Sheets의 약자로, CSS는 사용자에게 문서를 표시하는 방법을 지정하는 언어. 즉 웹 페이지의 스타일을 정의하는 언어이다. 우리가 작성한 HTML의 스타일, 레이아웃 등을 꾸미는 역할을 하고, CSS를 한번 작성해 여러 HTML에 재사용하여 반복 작업을 줄일 수 있다. 프론트엔드 개발자로서 제일 먼저 배우게 되는 세 가지 언어 HTML/CSS/JavaScript 중 하나이다. html: 웹페이지의 기본 틀 (뼈대)를 구성하는 역할 css: 웹페이지를 꾸며주는 역할 Javascript (JS): 동작들을 표현 CSS 적용 방법 CSS는 적용 방법에는 인라인 방식, 내부 스타일, 외부 스타일이 있다. 적용 방법은 외부 스타일의 방식을 추천하며, HTML과 C.. 2024. 1. 30.