개발자의 끄적거림

Position: CSS의 position 속성은 요소의 위치를 지정하는 데 사용됩니다. position 속성에는 다음과 같은 값들이 있습니다: static: 요소의 기본값으로, 일반적인 문서 흐름에 따라 배치됩니다. relative: 요소를 문서 흐름에 따라 배치한 후, top, right, bottom, left 속성을 사용하여 상대적인 위치를 지정할 수 있습니다. 다른 요소들과의 관계를 기준으로 이동합니다. absolute: 요소를 문서 흐름에서 제거하고, 가장 가까운 조상 요소 중에 position 값이 relative, absolute, 또는 fixed인 요소를 기준으로 위치를 지정합니다. fixed: 요소를 뷰포트(브라우저 창)를 기준으로 위치를 지정합니다. 스크롤해도 화면에 고정됩니다. Fl..

JQuery를 사용하여 자식, 부모, 형제 요소를 선택하기 위해 다양한 선택자를 활용할 수 있습니다. 아래에 각각에 대한 예시와 설명을 제공합니다. 1. 자식 요소 선택하기: 부모 요소의 자식 중 특정 요소를 선택하려면 children() 메서드를 사용합니다. 예를 들어, 요소의 자식 요소를 선택하려면 다음과 같이 작성할 수 있습니다: $('div').children('p'); 2. 부모 요소 선택하기: 현재 요소의 부모 요소를 선택하려면 parent() 메서드를 사용합니다. 예를 들어, 요소의 부모 요소를 선택하려면 다음과 같이 작성할 수 있습니다: $('p').parent('div'); 형제 요소 선택하기: 현재 요소의 다른 형제 요소를 선택하려면 siblings() 메서드를 사용합니다. 예를 들어,..

jQuery의 .siblings(), .next(), 그리고 .prev()는 DOM 요소를 조작하는데 사용되는 메서드입니다. 이들 메서드는 주어진 요소의 형제 요소를 선택하고, 다음 요소 또는 이전 요소를 선택하는데 도움을 줍니다. .siblings(): 이 메서드는 주어진 요소의 형제 요소를 선택합니다. 형제 요소란 같은 부모 요소를 공유하는 요소들을 말합니다. $(selector).siblings(); 위의 코드에서 $(selector)는 형제 요소를 찾고자 하는 요소를 선택하는 부분입니다. 이 메서드는 주어진 선택자에 해당하는 요소의 형제 요소들을 반환합니다. .next(): 이 메서드는 주어진 요소의 다음 요소를 선택합니다. 다음 요소란 DOM 구조에서 현재 요소의 다음 위치에 있는 요소를 말합니..

1. vscode 설치 기본적으로 개발 툴이 필요하다. 추천하는 개발툴은 visual studio code이며, 코드 개발 편의성이 좋다. 설치URL : https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. code.visualstudio...

React.js와 Node.js는 모두 JavaScript를 기반으로 한 오픈 소스 플랫폼이지만, 서로 다른 목적과 사용 방식을 갖고 있습니다. React.js: React.js는 사용자 인터페이스(UI)를 구축하기 위해 사용되는 JavaScript 라이브러리입니다. React.js는 Facebook에서 개발되었으며, 재사용 가능한 UI 컴포넌트를 구축하고 이들 컴포넌트를 조합하여 복잡한 UI를 만들 수 있게 도와줍니다. React.js는 가상 DOM(Virtual DOM)을 사용하여 UI 업데이트의 성능을 최적화하는데 중점을 둡니다. React.js의 주요 특징은 다음과 같습니다: 컴포넌트 기반: React.js는 컴포넌트 기반 아키텍처를 사용하여 재사용 가능하고 유지 관리가 용이한 UI 요소를 만들 ..

워드프레스(WordPress)는 웹사이트 및 블로그를 만들고 관리하기 위한 오픈소스 콘텐츠 관리 시스템(CMS)입니다. 워드프레스는 PHP와 MySQL을 기반으로 하며, 사용자들이 웹사이트를 쉽게 만들고 수정할 수 있도록 도와줍니다. 워드프레스는 사용자가 콘텐츠를 게시하고 관리하는 데 필요한 다양한 기능을 제공합니다. 사용자는 워드프레스를 사용하여 테마(디자인)를 선택하고, 플러그인(기능 확장)을 추가하고, 콘텐츠를 게시하며, 사용자들과 상호작용할 수 있는 기능을 추가할 수 있습니다. 워드프레스는 사용자 친화적인 인터페이스를 제공하여 비전문가도 웹사이트를 만들고 운영할 수 있도록 돕습니다. 또한, 다양한 테마와 플러그인을 제공하여 사용자가 웹사이트의 디자인과 기능을 맞춤 설정할 수 있습니다. 워드프레스는..

더보기 Mixed Content는 웹 페이지의 보안 문제로, 안전하지 않은 (non-HTTPS) 연결을 통해 로드되는 안전한 (HTTPS) 페이지에 포함된 리소스입니다. 웹 브라우저는 Mixed Content를 차단하거나 경고를 표시하여 사용자의 보안을 보호합니다. Mixed Content를 해결하기 위해 다음과 같은 방법을 고려할 수 있습니다: HTTPS 사용: 가장 좋은 방법은 모든 웹 페이지 및 리소스를 HTTPS로 제공하는 것입니다. HTTPS는 데이터의 암호화 및 안전한 전송을 보장하여 사용자의 개인 정보와 데이터를 보호합니다. 상대 경로 사용: 안전하지 않은 연결을 사용하는 리소스의 경로를 상대 경로로 변경하여 HTTPS로 로드되도록 할 수 있습니다. 예를 들어, "http://example...

TypeScript는 Microsoft에서 개발한 오픈 소스 프로그래밍 언어입니다. TypeScript는 JavaScript에 정적 타입을 추가하여 JavaScript 개발 경험을 향상시키는 것을 목표로 합니다. JavaScript 코드를 TypeScript로 변환하면 JavaScript 엔진에서 바로 실행할 수 있는 유효한 JavaScript 코드로 변환됩니다. 다음은 TypeScript의 주요 기능과 개념에 대한 설명입니다: 정적 타입: TypeScript는 변수, 매개변수, 함수 반환 값 등에 타입 주석을 추가하여 정적 타입 검사를 수행합니다. 이를 통해 컴파일 시간에 오류를 감지할 수 있으며, 코드 완성 기능 및 개발 도구의 지원을 받을 수 있습니다. let message: string = 'He..

초급개발자로 일하면서 초반에 가장 어려움을 겪었던 부분이 서버였습니다. 그래서 조금이나마 도움이 되고자 Windows 서버, Linux 서버에 대해서 간단 설명을 하고자 합니다. 운영 체제: Windows 서버는 Microsoft사의 운영 체제인 Windows Server 운영 체제를 사용하고, Linux 서버는 여러 가지 배포판(예: Ubuntu, CentOS, Debian)을 사용하는 Linux 운영 체제를 사용합니다. Windows Server는 상용 운영 체제로 상대적으로 비싸지만, Linux는 오픈 소스로 무료로 사용할 수 있습니다. 사용자 인터페이스: Windows 서버는 그래픽 사용자 인터페이스(GUI)를 사용하여 사용자가 마우스와 키보드를 통해 작업을 수행할 수 있습니다. 반면에 Linux..

PSA(Portable Service Abstraction)는 Java Spring 프레임워크에서 제공하는 핵심 개념 중 하나입니다. PSA는 애플리케이션 개발을 위한 여러 서비스를 추상화하고 표준화하는 계층적인 추상화 레이어를 제공합니다. PSA는 애플리케이션의 비즈니스 로직과 서비스 구현을 분리하고, 유연성과 확장성을 갖춘 애플리케이션을 개발할 수 있도록 돕습니다. PSA는 주로 다음과 같은 서비스 추상화를 제공합니다: 데이터 액세스 추상화(Data Access Abstraction): 데이터베이스 액세스와 관련된 작업을 추상화하여 특정 데이터베이스 기술에 종속되지 않는 방식으로 데이터 액세스를 처리할 수 있습니다. JDBC(Java Database Connectivity), JPA(Java Pers..