TIL 13

[웹][티스토리 블로그 꾸미기] 상단 헤더 꾸미기2

지난 상단 헤더 꾸미기 게시글이 꾸준히 유입률 1위를 담당하고 있어서 작성해보는 2탄 ( •̀ ω •́ )y이번 꾸미기는 아래가 둥근 상단박스 헤더(스크롤에 따라 색 변화) + 진행바 를 만들어보겠습니다.헤더를 변경한지 오래되어 어떤 순서로 얼만큼 수정했는지 기억이 가물하지만..최종 수정한 HTML 코드와 CSS 를 남겨둘테니 참고해주시면 감사하겠습니다! 기본 템플릿은 [ Odyssey ] 를 사용했고 이전 상단 헤더 꾸미기 1탄을 바탕으로 진행됩니다. 1. 아래가 둥근 헤더 박스기존의 상단을 가득 채운 네모 반듯한 상단바가 너무 딱딱한 느낌이 들어서아래만 둥글게 깎아 부드러운 느낌을 주겠습니다..header 클래스의 속성을 바꿔주기 위해스킨 편집 > HTML 편집 > CSS 탭에서 '/* header ..

TIL/블로그 2025.03.15

[알고리즘] 선형검색과 이진검색 (누구나 자료구조와 알고리즘 도서 스터디)

이 포스팅은 '누구나 자료구조와 알고리즘 개정2판' 을 스터디한 내용을 바탕으로 작성하는 공부기록이다. 알고리즘어떤 과제를 완수하는 명령어 집합어떤 자료 구조를 이미 결정했더라도 코드의 효율성에 영향을 미칠 수 있는 중요한 요인 선형 검색왼쪽에서 오른쪽으로 한 번에 한 셀씩 확인하며 값을 찾는 방식원소 수만큼 단계가 필요하다. (N개의 원소가 있을 때 검색에 필요한 단계는 N단계)이진 검색계속해서 중간 지점을 골라 남은 수 중 반을 제거해 나가며 값을 찾는 방식.정렬된 배열에서만 쓸 수 있다.원소 수를 두 배로 늘릴 때마다 검색에 필요한 단계는 한 단계만 늘어난다. (대단히 효율적인 부분)구현public static void main(String[] args) { // 이진검색 구현 실습 int[] ar..

TIL/알고리즘 2024.09.11

[자료구조] 집합 (누구나 자료구조와 알고리즘 도서 스터디)

이 포스팅은 '누구나 자료구조와 알고리즘 개정2판' 을 스터디한 내용을 바탕으로 작성하는 공부기록이다. 집합중복값을 허용하지 않는 자료구조연산(배열 기반 집합)읽기 : 배열과 마찬가지로 한 단계로 끝난다.검색 : 최대 N단계삽입중복값을 허용하지 않는다는 제약에 의해 삽입하려는 값이 이미 있는지 검색이 우선되어야 한다.맨 끝에 삽입하는 경우 N+1단계가 필요하고, 최악의 경우 맨 앞에 삽입할 때 N개를 검색하고 N단계를 거쳐 데이터 이동 후 값을 삽입하는 1단계로 총 2N+1단계가 필요하다.삭제 : 최대 N단계 삽입의 경우 일반적인 배열보다 느리지만 중복 금지가 지켜져야 할 경우는 집합이 답이며, 이는 곧 애플리케이션의 요구사항에 따라 어떤 자료구조가 더 적합한지를 결정해야 함을 의미한다.

TIL/자료구조 2024.09.11

[자료구조] 자료구조와 배열 (누구나 자료구조와 알고리즘 도서 스터디)

이 포스팅은 '누구나 자료구조와 알고리즘 개정2판' 을 스터디한 내용을 바탕으로 작성하는 공부기록이다. 자료구조 용어데이터 : 기초적인 수와 문자열자료구조 : 데이터를 조직하는 방법으로 같은 데이터를 다양한 방식으로 조직할 수 있다. → 데이터 조직은 그 방식에 따라 코드의 실행 속도에 영향을 미친다.속도 측정'연산이 얼마나 빠른가'를 측정한다.이때, 측정은 얼마나 많은 단계가 필요한지를 논해야 한다.배열크기 : 배열에 데이터 원소가 얼마나 들어있는지인덱스 : 특정 데이터가 배열의 어디에 있는지연산읽기 : 위치를 찾아보는 것배열은 각 인덱스에 특정 메모리 주소를 가지고 있고, 컴퓨터는 모든 메모리 주소에 한 번에 갈 수 있다.→ 배열의 읽기는 한 단계로 끝나는 가장 빠른 연산 유형이며 강력한 자료 구조이..

TIL/자료구조 2024.09.10

[웹/API] View Transition API

View Transitions API 여러 DOM 상태 간에 애니메이션 전환을 쉽게 생성하는 동시에 DOM 콘텐츠를 단일 단계로 업데이트할 수 있는 메커니즘 제공 모바일 앱을 사용하면서 화면 이동 전환이나 요소 애니메이션(슬라이드, 페이드 인-아웃 효과, 확대 등)을 흔히 볼 수있다. 이러한 애니메이션은 만들 수 있으나 그게 마냥 쉬운 것만은 아니다. SPA에서 이 같은 상태 간 전환에 CSS와 JS로 다음 과정을 수행한다. 이전 콘텐츠를 보여주면서 새 콘텐츠를 렌더링 → 애니메이션 발생 하며 전환 → 전환 완료 후 이전 콘텐츠 제거 위 과정에서 DOM에 이전 콘텐츠와 새 콘텐츠가 모두 표시되어 발생하는 문제가 있을 수 있는데, 이러한 DOM 변경 및 전환 애니메이션을 쉽게 처리하고자 등장한게 View ..

TIL/웹+앱 2023.03.25

[서버] XShell을 이용한 EC2 접속

1. XShell 무료판 설치 https://www.netsarang.com/ko/free-for-home-school/ 무료 라이선스 - NetSarang Website 무료 라이선스 무료 사용자의 최고의 선택 ㈜넷사랑컴퓨터는 강력한 SSH와 SFTP/FTP 클라이언트 프로그램을 지난 10년간 무료로 배포해온 것에 대해 자부심을 느낍니다. 저희 무료 라이선스는 단지 www.netsarang.com 정보 입력하면 메일로 다운로드 링크 설치 파일을 통해 설치 2. 파일 > 새로 만들기 3. 연결 메뉴 - 일반 탭 이름 : 임의의 이름 세팅 프로토콜 : SSH 호스트 : 도메인 주소(ex. mysite.com) 포트번호 : 22 4. 연결 > 사용자 인증 메뉴 Password 체크 해제 Public Key ..

TIL/인프라 2023.03.16

[인프라/웹서버] HTTPS 설정을 위한 SSL 인증서 설치

1. Certbot 저장소 설정 및 설치 sudo apt-get update sudo apt-get install software-properties-common sudo add-apt-repository universe sudo add-apt-repository ppa:certbot/certbot sudo apt-get update sudo apt-get install certbot python3-certbot-nginx 2. SSL 인증서 획득 sudo certbot --nginx -d mysite.com - mysite.com 은 인증서를 적용할 도메인을 적어주면 된다. 3. 인증서 자동 갱신 sudo certbot renew --dry-run

TIL/인프라 2023.03.15

[웹/Vue.js/WebRTC] OpenVidu 설치부터 테스트까지

⚠️이 내용은 2021년도 프로젝트를 진행하며 작성했던 문서로 최신 버전과 다를 수 있습니다. 목차 0. 환경설정 1. 배포 1.1. 권장 설치 1.2. OpenVidu-Server Custom Dockerizing 1.3. 실행 2. Nginx 및 방화벽 설정 3. 실행 후 통신 확인 0. 환경 설정 본 문서는 환경 설정의 설치에 대해 깊게 다루지 않습니다. AWS EC2 Java Version : open-jdk-11 (openvidu 2.20.0 버전 사용 시 jdk 11 필요) maven : 3.6.3 docker docker-compose 도메인 구성 : HTTPS 를 사용하여 배포. Let's Encrypt를 사용하여 SSL 인증서 생성 서버 포트 구성 (공식문서 권장) ufw allow : ..

TIL/웹+앱 2023.03.15

[해결] MSSQL/mybatis Incorrect syntax near '@P5'.

IDE : Intellij Framework : Spring Boot Build : Gradle DB : MSSQL JDBC : mybatis Error : Incorrect syntax near '@P5'. Solve : 위 에러 문구를 구글에 검색했을 때, Stack Overflow와 다른 블로그에서 여러 해결방안을 내왔다. 일단 나의 문제는 매퍼의 SQL INSERT 쿼리문에서 컬럼 사이 ',' 를 쓰지 않아 생긴 문제였다. '@P5' 라는 키워드가 내 쿼리엔 없는데 대체 무슨일이지? 데이터를 잘못 받았나 싶었다. 이 뜻은 파라미터(P) 중 5 번째를 의미한다. 다른 사람들은 '@P0' 에서 오류가 나던데 그 경우는 괄호가 빠져 있다거나, 한글인코딩, `SQLServer20xxDialect` 등 의..

TIL/에러 2022.12.09
728x90
반응형