본문 바로가기

WEB개발

 (80)
[UI/UX] 참고자료 - 인라인(inline), 시맨틱(semantic), 마진(margin) 1. 인라인요소 HTML에서 인라인 요소는 텍스트 안에 둘러쌓여 표시되는 요소로, 블록 레벨 요소와 달리 한 줄에 나란히 표시됩니다. 주로 텍스트 스타일링이나 구문 강조 등에 사용됩니다. 일반적인 인라인 요소는 다음과 같습니다 인라인요소는 width, height이 적용안된다. : 텍스트의 일부분을 그룹화하거나 스타일링하기 위해 사용됩니다. : 하이퍼링크를 만들 때 사용됩니다. : 텍스트를 굵게 표시하여 강조할 때 사용됩니다. : 텍스트를 이탤릭체로 표시하여 강조할 때 사용됩니다. : 이미지를 삽입할 때 사용됩니다. : 줄 바꿈 요소로, 텍스트를 줄 바꿈하기 위해 사용됩니다. : 사용자 입력을 받는 양식 요소로, 텍스트 입력, 체크박스, 라디오 버튼 등을 생성할 때 사용됩니다. 2. 시맨틱태그 (Sema..
[Java] 참고 (try-catch-finally, try-with-resources, final컴파일, wrapper, stringbuilder/stringbuffer / 인터페이스 (interface)) / 동적로딩 (reflection) try catch finally 순서try { // 프로그램 실행 로직} catch(Exception e) { // 예외발생 시의 로직} finally {}1. 기본 실행 순서: - try문에서 예외가 발생하지 않았으면 catch문은 생략되어 try문이 실행된 이후에 finally문이 실행되고, (try > finally) -try문에서 예외가 발생했으면 try문, catch문 순서로 실행된 이후에 finally문이 실행된다. (try > catch > finally)- try문이나 catch문 안에 return문 또는 throw문이 있다면, 그 return문 또는 throw문 전까지 로직이 실행된 후 finally문이 실행되고 나서 그 return문 또는 throw문이 실행된다  (try or catc..
[URL] request url getRequestURL(): 이 메서드는 요청을 받은 웹 페이지의 URL을 가져옵니다. 이 URL은 프로토콜, 서버 이름, 포트 번호 및 요청된 파일의 경로를 포함합니다. getRequestURI(): 이 메서드는 클라이언트가 요청한 자원의 URI(Uniform Resource Identifier)를 가져옵니다. URI는 호스트 이름과 포트 번호를 제외한 요청된 파일의 경로를 나타냅니다. 예를 들어, "/myapp/myservlet"와 같은 URI를 반환할 수 있습니다. getContextPath(): 이 메서드는 현재 웹 애플리케이션의 컨텍스트 경로를 가져옵니다. 즉, 웹 애플리케이션의 루트 경로를 나타내는 문자열을 반환합니다. 예를 들어, "/myapp"과 같은 컨텍스트 경로를 반환할 수 있습니다...
[Docker] 도커(docker) 효율적인 배포와 확장:도커는 컨테이너화 기술을 사용하여 애플리케이션과 모든 종속성을 포함하는 가상 환경을 만듭니다. 이는 배포가 훨씬 빠르고 간단해지며, 확장성이 뛰어납니다.환경 일관성 유지:도커 컨테이너는 모든 종속성과 환경 설정을 포함하기 때문에, 개발, 테스트, 스테이징, 프로덕션 등 모든 환경에서 동일한 환경을 유지할 수 있습니다.리소스 분리와 격리:도커는 호스트 시스템에서 각 컨테이너를 격리시켜 서로 영향을 주지 않고 독립적으로 실행할 수 있도록 합니다. 이는 성능을 최적화하고 보안을 강화하는 데 도움이 됩니다.유연한 개발 및 테스트 환경:도커는 로컬 환경에서 개발 및 테스트를 쉽게 할 수 있도록 도와줍니다. 개발 환경을 컨테이너로 패키지하고 간단히 공유할 수 있으며, 다양한 환경에서 실행할 수..
[Spring Boot] 인텔리제이 Intellij 정적리소스 자동리로드 1. build.gradle 파일에 devtools dependency를 추가 dependencies { compileOnly("org.springframework.boot:spring-boot-devtools") } 4. application.yml, application.properties 파일에 devtools 설정 추가 spring: devtools: livereload: enabled: true restart: enabled: true thymeleaf: cache: false spring.devtools.livereload.enabled=true 5. Build Project automatically - Preferences 에서 Compirer에 Build Project automatical..
[React] Next, Typescript... 오류모음 1. EPERM: operation not permitted, rename > npm cache clean --force > 관리자권한 재실행 2. Error: Cannot find module 'prettier' from > npm install --save-dev prettier 3. 모듈 못찾을 경우Cannot find module 'next/dist/lib/metadata/types/metadata-interface.js' or its corresponding type declarations next버전 최신화, 캐시삭제 yarn add next@latest pnpm store prune or "moduleResolution": "node", { "compilerOptions": { "target..
[React] web성능 메트릭 HTML 삽입 미리보기할 수 없는 소스 `CRA(create-react-app)` 디폴트 파일 중 하나 리액트 프로젝트를 생성하면 index.js에서 사용 앱의 퍼포먼스 시간들을 분석하여 객체 형태로 보여주는 것이 목적.다음과 같이 작성하여 콘솔에서 확인이 가능. 즉, 사용자들에게 편의를 제공하는 페이지나 컴포넌트는 아니므로 삭제해도 무방하다. reportWebVitals(console.log);​​​​ LCP (Largest Contentful Paint) 페이지에서 가장 용량이 큰 컨텐츠가 표시되는 시점을 나타낸다. CLS (Cumulative Layout Shift) 페이지가 로드되기 시작하는 시점과 lifecycle 상태가 숨김으로 변경되는 시점 사이에 발생하는 모든 예기치 않은 레이아웃 이동의 ..
Typescript : 동적인 자바스크립트 언어에 타입을 미리 부여함으로써 컴파일 시 에러를 잡을 수가 있다. 기본 타입:number : 숫자 타입string : 문자열 타입boolean : 불리언 타입any : 모든 타입을 허용하는 동적 타입void : 반환 값이 없는 함수의 리턴 타입undefined : undefined 값 또는 타입null : null 값 또는 타입unknown : `unknown`은 "아직 타입을 알 수 없음" 이라는 의미 - any처럼 어떤 값도 담을 수 있음 - 하지만 사용하려면 타입 좁히기가 필요함let value: unknown;value = "hello";value = 42;value = { name: "Alice" };console.log(value.le..

티스토리툴바