본문 바로가기

웹디자인 (HTML,JS)44

Selenium Grid 웹 응용 프로그램 다양한 브라우저 테스트 자동화 Selenium Grid는 웹 응용 프로그램을 자동으로 테스트하거나 웹 브라우저 기반의 작업을 자동화하는 데 사용되는 도구 중 하나입니다. Selenium Grid는 다음과 같은 주요 목적을 가지고 있습니다. 병렬 테스트: Selenium Grid는 여러 대의 컴퓨터(노드)에서 동시에 웹 테스트를 실행할 수 있도록 도와줍니다. 이를 통해 테스트를 병렬로 실행하여 테스트 수행 시간을 줄일 수 있으며, 빠르게 다양한 환경에서 웹 응용 프로그램을 테스트할 수 있습니다. 다양한 브라우저 및 플랫폼 지원: Selenium Grid를 사용하면 다양한 종류의 웹 브라우저(예: Chrome, Firefox, Edge 등) 및 운영 체제(예: Windows, macOS, Linux)에서 테스트를 실행할 수 있습니다. 이.. 2023. 10. 30.
Next.js 서버 측 변수 노출 보호 안전조치 Next.js에서 서버 측 변수를 프론트엔드에 노출되지 않도록 보호하려면 몇 가지 접근 방식을 사용할 수 있습니다. 이러한 방식은 보안상 중요한 정보를 안전하게 처리하는 데 도움이 됩니다. 환경 변수 사용: 환경 변수는 .env.local 파일을 통해 관리됩니다. 이 파일에 중요한 서버 측 정보를 저장하고, process.env를 통해 접근할 수 있습니다. 환경 변수는 클라이언트 측에서 접근할 수 없으며, 서버 측에서만 사용됩니다. // .env.local 파일에 추가 SECRET_KEY=mysecretkey // Next.js 페이지에서 환경 변수 사용 const secretKey = process.env.SECRET_KEY; 서버 측 데이터 가져오기: 프론트엔드에서 서버 측 데이터를 가져올 때, 클라.. 2023. 10. 1.
HTML 엔티티(Entities) 대표적인 유형 표시 글자 엔티티 숫자 엔티티 이름 설명 space > > greater than & & & ampersand ' ' ' (IE에서 안됨) apostrophe " " " quotation mark ‘ ‘ ‘ left single quotation mark ’ ’ ’ right single quotation mark “ “ “ left double quotation mark ” ” ” right double quotation mark ° ° ° degree · · · middle dot × × × multiplication ÷ ÷ ÷ division ? − − minus ∞ ∞ ∞ infinity ∼ ∼ ∼ simular to ≠ ≠ ≠ not equal ≤ ≤ ≤ less or equal.. 2023. 3. 24.
jquery로 높이(height)와 넓이(width) 측정하는 방법 jquery가 정점을 찍은 후 지금은 Angular, react, vue에 의해 퍼블리싱 업계에서 조금씩 힘을 잃어가고 있긴 하지만 아직까지 현장에서 가장 많이, 그리고 요긴하게 사용되고 있는 기술임에는 틀림없습니다. 그중에서 가장 많이 사용되는 Function중 하나가 element's(요소)의 높이와 넓이 값을 알아내거나 세팅할 때 매우 편리하게 사용할 수 있는 height(), width() 가 아닐까 합니다. 쉽지만 헷갈리기 쉬운 element's(요소)의 높이(height)와 넓이(width)를 측정하는 방법을 소개하려고 합니다. 사전 지식 이것을 설명하기 전에 element's(요소)의 크기 값에 영향을 미치는 구성방식을 간단히 설명하면 아래와 같습니다. div 요소가 있다고 하면 내부의 여백.. 2021. 4. 29.
<jQuery> 선택자와 스타일(CSS) .css() .css()로 선택한 요소의 css 속성값을 가져오거나 style 속성을 추가합니다. 문법 1 .css( propertyName ) 속성값을 가져옵니다. 예를 들어 $( "h1" ).css( "color" ); 는 h1 요소의 스타일 중 color 속성의 값을 가져옵니다. 문법 2 .css( propertyName, value ) style 속성을 추가합니다. 예를 들어 $( "h1" ).css( "color", "green" ); 는 h1 요소에 style 속성을 추가하여 글자색을 녹색으로 바꿉니다. ... .grand { width: 400px; height: 400px; background-color: deepskyblue; } .parent { width: 300px; height: .. 2021. 4. 27.