본문 바로가기

Web Programming17

프론트엔드와 백엔드 입문 개발자 프론트엔드(Front-end)와 백엔드(Back-end)는 웹 개발에서의 두 가지 주요 영역입니다. 프론트엔드 개발자나 백엔드 개발자로 입문하기 전 두 가지 영약에 대해서 알아보겠습니다. 프론트엔드(Front-end) 프론트엔드는 사용자가 웹 페이지를 보고 상호작용할 수 있도록 담당하는 부분입니다. 주로 웹 브라우저에서 실행되며, 웹 페이지의 시각적인 부분과 사용자 인터페이스(UI)를 개발합니다. HTML (Hyper Text Markup Language): 웹 페이지의 구조와 콘텐츠를 정의하는 마크업 언어입니다. 태그를 사용하여 요소들을 구성하고, 각 요소에 의미를 부여합니다. CSS (CasCading Style Sheets): 웹 페이지의 디자인과 스타일을 지정하는 스타일 시트 언어입니다. HTML.. 2023. 12. 21.

HTML / 파일 경로 작성 하는 방법 / 절대 경로, 상대 경로 / Failed to load resource: the server responded with a status of 404 () 경로(Path) 파일이나 디렉토리의 위치를 나타내는 문자열이다. HTML에서는 href 속성이나 src 속성과 함께 사용되며, 경로(path)는 상대 경로와 절대 경로로 나뉜다. 디렉토리(Directory) : 파일을 저장하는 그룹화 단위로. 디렉토리 또는 "폴더"라고도 불린다. 1. 상대 경로(Relative Path) 현재 작업 중이 디렉토리의 위치를 기준으로 다른 파일이나 디렉토리의 상대적인 위치를 나타낸다. 현재 디렉토리의 파일 : ./filename 상위 디렉토리의 파일 : ../filename 하위 디렉토리의 파일 : ./directory/filename 2. 절대 경로(Absolute Path) 파일 시스템의 루트 디렉토리부터 해당 파일의 전체 경로를 나타낸다. 파일이나 디렉토리의 위치와는 .. 2023. 12. 15.

bootstrap / CSS / grid 사용 방법 / 작은 화면에서 col 사라지게 만들기 / d-none d-block 사용 방법 부트스트랩 그리드 (Bootstrap Grid System) 부트스트랩은 그리드 시스템을 제공하여 웹 페이지의 레이아웃을 구성하는 도움을 줍니다. 그리드 시스템은 웹 펭지를 일정한 열과 행으로 분할하여 콘텐츠를 배치하는 방법을 제공합니다. 이를 통해 반응형 웹 디자인을 구현하고 다양한 디바이스에 대응할 수 있습니다. 그리드 시스템의 구성 요소 1. 컨테이너(Container) : 그리드 시스템을 감싸는 가장 바깥쪽 요소입니다. .container 클래스를 사용하여 컨테이너를 생성할 수 있습니다. 2. 행(Row) : 컨테이너 내부에서 그리드 행을 생성합니다. .row 클래스를 사용하여 행을 생성할 수 있습니다. 3. 열(Column) : 행 안에 열을 생성합니다. .col 클래스를 사용하여 열을 생성할 .. 2023. 12. 14.

Brackets / bootstrap 사용 방법 / CDN 방법 / 다운로드 연결 방법 부트스트랩(BootStrap)? 부트스트랩은 웹 개발을 위한 오픈 소스 프론트엔드 프레임워크입니다. HTML, CSS, JavaScript를 기반으로 하여 웹 페이지의 디자인과 레이아웃을 쉽게 구축할 수 있도록 도와줍니다. 부트스트랩(Bootstrap) 사용방법 보트스트랩을 사용하는 방법으로는 부트스트랩을 다운로드하여 연결하는 방법과, npm을 통해서 설치하는 방법, 그리고 CDN을 사용하는 방법이 있습니다. 1. 부트스트랩 CDN 사용 방법 CDN(Content Delivery Network)은 CSS, JavaScript 파일을 웹사이트 서버가 아닌 다른 공유 공간에 두고 여러 웹사이트가 사용할 수 있게 하는 서비스이다. 별도의 다운로드가 필요 없어 페이지 로딩 속도가 빠르다는 장점이 있다. 1. 부.. 2023. 12. 13.

bootstrap / 부트스트랩 사용 방법 / CDN 연결하기 부트스트랩(Bootstrap)이란? 부트스트랩은 웹 개발을 위한 오픈 소스 프론트엔드 프레임워크이다. 트위터에서 개발된 이 프레임워크는 HTML, CSS, JavaScript를 기반으로 하여, 반응형 웹 디자인과 다양한 컴포넌트, 그리드 시스템 등을 제공하여 개발자들이 빠르고 효율적으로 웹 페이지를 개발하고 디자인할 수 있도록 도와준다. 부트스트랩(Bootstrap) 사용 방법 부트스트랩을 사용하는 방법으로는 부트스트랩을 직접적으로 다운로드하여서 자신의 환견에 위치시킨 후 사용하는 방법과, npm을 통해서 설치하는 방법, 그리고 CDN(Content Delivery Network)을 사용하는 방법이 있다. CDN이란 html 파일에서 참조하는 css, javascript 파일을 웹사이트 서버가 아닌 다른.. 2023. 12. 12.

오버로딩(Overloading)과 오버라이딩(Overriding) 쉽게 이해하 메서드 시그니처(method signature) 메서드 오버로딩의 핵심은 바로 메서드 시그니처(method siganture)에 있습니다. 메서드 시그니처랑 메서드의 선언부에 명시되는 매개변수의 리스트를 가리킵니다. 만약에 두 메서드가 매개변수의 개수와 타입, 그 순서까지 모두 같다면, 이 두 메서드의 시그니처는 같다고 할 수 있습니다. 오버로딩과 오버라이딩의 차이점 오버라이딩(Overriding)과 오버로딩(Overloading)은 객체 지향 프로그래밍에서 다형성을 구현하는 방법이다. 그러나 둘은 서로 다른 개념이다. 오버라이딩(Overriding) 오버라이딩이란 상속 관계에 있는 부모 클래스에서 이미 정의된 메서드를 자식 클래스에서 같은 시그니쳐를 갖는 메서드로 다시 정의하는 것이라고 할 수 있습니다.. 2023. 12. 11.

this와 this()의 차이점과 사용 방법 this와 this() this와 this() 키워드는 객체 지향 프로그래밍에서 객체의 멤버 변수와 메서드에 접근하고, 생성자 간의 호출 관계를 유지하는 데 사용되는 키워드입니다. this는 객체 자신을 참조하며 멤버 변수와 메서드에 접근하는 데 사용되고, this()는 생성자 간이 호출을 담당하여 객체의 초기화를 수행합니다. this this는 객체 자신을 참조하는 키워드입니다. 객체 내부에서 this를 사용하여 현재 객체의 멤버 변수와 메서드에 접근할 수 있습니다. 멤버 변수와 메서드의 이름이 같을 때, this를 사용하여 멤버 변수임을 명시할 수 있습니다. this를 사용하여 멤버 변수에 값을 할당하거나 반환할 수 있습니다. this() this()는 현재 객체의 다른 생성자를 호출하는 키워드입니다.. 2023. 12. 10.

JAVA / 객체 지향 프로그래밍 / 클래스의 개념과 특징 객체 지향 프로그래밍 (Object-Oriented Programming, OOP) 자바는 객체 지향 프로그래밍 언어로, 객체 지향 프로그래밍의 특징을 모두 지원하고 있습니다. 자바에서는 클래스를 사용하여 객체를 생성하며, 이러한 객체들 간의 상호작용을 통해 프로그램을 구성합니다. 자바에서는 객체를 생성하기 위한 클래스를 정의하고, 이 클래스의 인스턴스를 생성하여 사용합니다. 클래스는 객체의 속성(변수)과 동작(메서드)을 정의하며, 이러한 클래스를 기반으로 객체를 생성하고 사용합니다. 자바에서는 상속, 다형성, 캡슐화와 같은 객체 지향 프로그래밍의 다양한 개념을 지원합니다. 상속을 사용하여 이미 존재하는 클래스를 확장하고, 다향성을 사용하여 같은 이름의 메서드를 다른 방식으로 구현하는 등의 기능을 제공합.. 2023. 12. 10.

오류(error)와 예외(exception) / 예외 처리 try-catch 프로그래밍의 오류의 종류 프로그램에서 오류가 발생되면 프로그램에서 원치 않는 버그가 발생하거나, 심각하면 실행 중인 프로그램이 종료되기도 한다. 오류의 원인으로는 프로그램 로직에 문제가 있을 수도 있고, 하드웨어에 문제가 있어 오류가 발생할 수도 있다. 실제로 프로그래밍을 할 때 발생하는 오류는 단순 오타부터 시작해서 프로그램의 잘못된 설계로 인한 메모리 펑크까지 범위가 다양하다. 컴파일 에러(compile-time error) : 컴파일 시 발생하는 오류 런타임 에러( runtime error) : 실행 시에 발생하는 오류 논리적 에러(logical error) : 실행은 되자만 의도와 다르게 동작하는 것 컴파일 오류(Compillation Error) 컴파일 에러는 컴파일 단계에서 오류를 발견하면 컴.. 2023. 12. 8.

이전 1 2 다음

티스토리툴바