[Rookies 개발 2기] FullPage.js 모바일 환경 레이아웃 이슈
·
SK 루키즈/FE
들어가기 앞서최종 프로젝트를 진행하면서 디자인적으로 깔끔함과 각 섹션과의 역할을 명확히 하기 위해`FullPage.js` 라는 라이브러리를 사용하기로 하였다.https://alvarotrigo.com/fullPage/ fullPage scroll snapping. Create full screen pages fast and simpleMouse wheel snap to sections. Fast and simple to use.alvarotrigo.com 해당 라이브러리는 웹 페이지에서 전체 화면 스크롤링 효과를 구현할 수 있고,여러 섹션으로 나누어 섹션 젠체를 스크롤링으로 전환할 수 있다. 하지만 우리는 섹션의 스크롤링을 막고 해당 정보가 들어올 시 그 정보를 가지고 다음 섹션으로 넘어가게끔강제를 시키..
HTML 특수문자 표현
·
HTML&CSS
가끔 개발하다 보면 특수문자를 쓸 일이 생기는데 이모지로 하자니 OS에 따라 다르게 보이고,어떠한 특수문자를 넣자니 다른 브라우저에서 깨져 보이는 일이 생긴다. 그러기에 반드시 정해진 문자코드를 사용해야 하는데 매번 찾아보기도 귀찮아서 블로그에 정리하려고 한다. 문자설명HTML엔티티 코드숫자 코드less than<<>greater than>>&ampersand&&※reference mark (없음)&#8251"double quote""'single quote' (HTML5 지원)'©copyright©©®registered mark®®™trademark™™¥yen sign¥..
[Rookies 개발 2기] 자바스크립트와 타입스크립트 차이점
·
SK 루키즈/FE
TypeScript 란?타입스크립트(TypeScript)는 마이크로소프트에서 개발한 오픈소스 프로그래밍 언어이다. 자바스크립트의 상위 집합(Superset)으로 설계되어 기존 자바스크립트 코드와 100% 호환되며, 정적 타입(Static Type) 기능을 추가하여 코드의 안정성과 가독성을 향상하는 데 목적이 있다. 타입스크립트의 가장 큰 특징은 컴파일 타임에 타입 오류를 잡아낼 수 있다는 점이다. 이는 런타임 에러를 사전에 방지하고, 개발자가 의도한 대로 동작하는 코드를 작성할 수 있도록 돕는다. 또한, 코드 자동완성, 리팩토링, 타입 추론 등 다양한 도구 지원을 통해 대규모 프로젝트에서의 유지보수성과 생산성을 크게 향상할 수 있다. 타입스크립트는 .ts 확장자를 사용하며, 브라우저가 직접 실행할 수 없..
[Rookies 개발 2기] (비트) Vite 란?
·
SK 루키즈/FE
Vite란?Vite는 모던 웹 애플리케이션 개발을 위한 빌드 도구이자 개발 서버이다. Evan You (Vue.js의 창시자)에 의해 개발되었으며, 주로 빠른 빌드 속도와 효율적인 개발 환경을 제공한다. 여담으로 발음에 관련해선 바이트?라고 하는 사람도 있는데, “Vite”는 프랑스어에서 “빠르게” 또는 “빨리”라는 의미의 형용사이다. 발음은 “ite”는 “it”처럼 발음되어 비트라고 불린다. 다시 돌아와 Vite는 빠르고 간결한 모던 웹 프로젝트 개발 경험에 초점을 맞춰 탄생한 빌드 도구로, 두 가지 핵심 컨셉을 중심으로 설계되었다. 첫 번째는 개발 시 네이티브 ES Module을 넘어 다양한 기능을 제공하는 것이다. Vite는 개발 중 Hot Module Replacement(HMR)을 지원하여, 코..
Mac 에서 iTerm 단축어 설정 (줄 삭제, 앞뒤로 이동)
·
잡다한
시작하며흔히 맥북이나 아이맥을 사용하는 Mac OS 유저들은 단축어를 주로 쓰는데 필자가 제일 자주 쓰는 명령어는`option⌥ + delete⌫` 단어 삭제, `command⌘ + delete⌫` 한줄 삭제이다.이 기능은 iTerm에서 동작하지 않거나, 다른키로 바인드 되어있어 사용하고자 한다. 기존 문제점iTerm에서 한 줄 삭제는 `control + U` , 단어 삭제는 `control + w` 로 되어있다.이 단축키는 hex code 0x15 와 0x17로 설정되어 있다 또한 윈도우의 home과 end와 유사한 `command⌘ + ←` , `command⌘ + →` 또한 바인딩이 되어있으며,hex 0x01 과 0x05 이다. 이제 iTerm 설정에서 키를 바꾸어 적용하면 된다! 적용하기iTerm..
홈페이지 https 적용하기
·
잡다한
작성자 : B989037 이승호연락처 : ghehf51@naver.com작성 일시 : 2024.03.05 우리 학과 홈페이지 환경은 Apache 2.4.5 그리고 CentOS로 구성되어 있다.https 설정SSL 인증서는 무료 SSL 인증서인 Let’s Encrypt의 SSL 인증서를 적용한다. 다른 SSL 인증서 업체와는 달리 무료이며 단, 유효기간이 3개월이어서 배치작업 또는 수동으로 3개월 만료 전에 인증서를 주기적으로 재발급받아야 한다. letsencrypt 패키지 설치 및 Let’s Encrypt SSL 인증서 발급먼저 CentOS를 사용하기에 yum 명령을 통해 다음과 같이 letsencrypt 라는 패키지를 설치한다. 뒤에 url은 `software.hongik.ac.kr` 로 입력하면 된다..
파이썬에 설치된 pip 라이브러리 전체 삭제
·
잡다한
프로젝트를 진행하며 Jetbrain 사의 PyCharm을 사용하던 중새 프로젝트에 자동으로 인터프리터 설정과 가상환경을 만들어 주는 걸 알게 되었다. 그러므로 그동안 용량만 차지하고 있던 로컬환경의 파이썬 패키지 라이브러리를 삭제하도록 하겠다 삭제 방법 삭제 리스트 추출 먼저 하나하나 `pip uninstall ~~` 를 할 수도 있지만 그건 너무 귀찮은 일.먼저 무엇이 있는지 리스트를 뽑아보자. pip list 이렇게 입력하면 아래와 같이 설치되어 있는 라이브러리들이 출력된다. 학부생 때 사용하던 jupyter notebook의 부산물들과 keras, torch 등등 지금은 사용하지 않고 용량만 차지하는 이들이 있는데,이들을 한 번에 무찌르기 위해 `. txt` 파일로 만들어 출력하자. pip fr..
[Rookies 개발 2기] Nginx 404 에러 해결
·
SK 루키즈/Cloud
문제 시작기본 구조바야흐로 2번째 프로젝트를 AWS에 배포 마무리하던 중 에러가 발생하였다.먼저 간단히 구동 원리를 설명하자면 클라이언트(리액트)에서 채팅방을 입력하면 const enterChatRoom = (roomId) => { window.location.href = `/chatroom/${roomId}`; }; `App.js` 에서 아래와 같이 채팅방을 동적 라우트로 추가하고, function App() { return ( ``` } /> );} ChatRoom 컴포넌트에서 WebSocket의 앤드포인트로 연결한다. websocket.cur..