본문 바로가기

FE 개발9

SSH 의미와 뜻 : 터미널 SSH키 생성 및 깃허브 GitHub 등록 SSH 의미 뜻 터미널 SSH키 생성 깃허브 GitHub 등록 안녕하세요. 코딩하는 기획자 Daniel입니다. SSH란? Git을 사용하다보면 SSH라는 용어를 많이 들어보셨을 텐데요. SSH(Secure Shell)란? 두 컴퓨터 간 통신을 할 수 있게 해주는 하나의 프로토콜(protocol) 입니다. 주로 레파지토리(Repositories)의 보안 설정을 위해 설정하며, 토큰 키를 생성해서 보안 설정을 하는 회사도 있습니다. SSH키 생성 이곳에는 타이틀에 대한 설명이 들어갑니다. ssh-keygen -t rsa -b 4096 -C "test@gitHub.com" ssh-keygen : ssh 비대칭키 생성 명령어 -t rsa : 암호화 타입을 rsa 방식을 사용 -b 4096 : 생성할 키의 비트수.. 2024. 2. 26.
윈도우 터미널(windows terminal) 설치 및 꾸미기 ZSH 윈도우 터미널(windows terminal) 설치 및 꾸미기 ZSH 안녕하세요. 코딩하는 기획자 Daniel입니다. 리눅스 : 윈도우(windows) 10 PRO 64bit에 WSL2 설치 리눅스 윈도우(windows) 10 PRO 64bit WSL2 설치 안녕하세요. 코딩하는 기획자 Daniel입니다. 들어가기에 앞서 먼저 WSL2 실행을 위한 요구사항을 확인해야 합니다. 윈도우 PC(x64 시스템)의 경우(windows 10 PRO) miroiter.tistory.com 들어가기에 앞서 지난 포스팅 리눅스 윈도우(windows) 10 PRO 64bit에 WSL2 설치에서 윈도우에서 리눅스 환경을 세팅하는 방법에 대해 알아보았습니다. 이번 포스팅에서는 개발환경 세팅 2편으로 윈도우 터미널(window.. 2024. 2. 22.
리눅스 : 윈도우(windows) 10 PRO 64bit에 WSL2 설치 리눅스 윈도우(windows) 10 PRO 64bit WSL2 설치 안녕하세요. 코딩하는 기획자 Daniel입니다. 들어가기에 앞서 먼저 WSL2 실행을 위한 요구사항을 확인해야 합니다. 윈도우 PC(x64 시스템)의 경우(windows 10 PRO)에 버전 1903 이상, 빌드 18362 이상에서만 WSL2를 설치할 수 있습니다. 이 정보를 확인하기 위해서는 윈도우의 버전 및 빌드 번호를확인해야 합니다. 윈도우키와 R키를 눌러 '실행'창이 나타나면 'winver'를 입력하여 윈도우 버전과 빌드번호를 확인합니다. [WIN] + R 선택 후 'winver'를 입력 버전과 빌드번호 확인 가상 머신(Virual Machine) 기능 사용 자 이제 가상 머신 기능을 사용하게 설정을 해줘야 합니다. 먼저 윈도우 .. 2024. 2. 19.
[반응형 UI] PC Mobile 한번에 사용가능 한 제이쿼리(jQuery) 햄버거 GNB 메뉴 반응형 웹에서 사용하면 좋을 제이쿼리(jQuery) GNB 들어가기에 앞서 반응형 웹사이트를 구축하기위해서 기존에 사용하던 PC GNB(Global Navigation Bar)와 모바일 햄버거 메뉴(mobile burger menu)를 각각 만들어 CSS show/hide로 기능을 구현했었습니다. 그러던 중 지난 프로젝트에서 사용했던 유용한 코드가 있어서 이웃님들께 소개해 드려봅니다. 아래 코드는 HTML5, CSS3, jQuery를 원할하게 이해하고 수정할 수 있는 능력이 필요합니다. 난이도 (중급 / ★★★☆ ☆) 제이쿼리 버전은 1.8.21.이며, 최신버전에서도 정상적으로 동작합니다. HTML5 메뉴열기 메뉴닫기 상단 메인메뉴 영역 대메뉴 depth2 depth3 depth3 depth3 CSS3 .. 2024. 1. 4.
티스토리 검색 엔진 최적화(SEO)를 위한 robots.txt 설정 방법 티스토리 검색 엔진 최적화(SEO)를 위한 robots.txt 설정 방법 들어가기에 앞서 이전 포스팅에서 저는 구글 서치 콘솔(google search console)을 사용해서 구글 검색 등록을 마쳤습니다. 하지만 좀 더 명확하게 네이버와 구글에서 검색 엔진 최적화(SEO: Search Engine Optimization)를 하기위한 방편으로 검색 로봇이 제 티스토리를 크롤링하기 위해 robots.txt파일을 설정해 보려고 합니다. 네이버 robots.txt 설정 먼저 네이버 서치 어드바이저(Naver Search Advisor) 웹 사이트에 접속합니다. 웹 마스터 도구 페이지로 이동 후 사이트 관리에서 등록된 티스토리 사이트를 선택합니다. 왼쪽 메뉴에서 검증 메뉴를 선택하면 하위메뉴에 robots.t.. 2023. 12. 30.
티스토리 네이버 검색등록 네이버 서치 어드바이저(Naver Search Advisor) 티스토리 네이버 검색등록 네이버 서치 어드바이저 (Naver Search Advisor) 들어가기에 앞서 지난 포스팅에 이어 네이버 검색 엔진 최적화(SEO : Search Engine Optimization)를 제 티스토리에 적용해서 네이버에서 검색을 했을 때 저의 티스토리 블로그가 검색 결과에 노출되도록 네이버 서치 어드바이저(Naver Search Advisor)를 사용해 네이버 검색 로봇이 제 티스토리 블로그의 데이터를 수집할 수 있도록 세팅해 보겠습니다. 네이버 서치 어드바이저 먼저 네이버 검색 등록을 위해 네이버 서치 어드바이저(Naver Search Advisor) 사이트로 접속합니다. 접속한 뒤에는 사이트 관리 메뉴에서 티스토리 URL을 입력해 줍니다. 네이버 서치 어드바이저의 주소(URL.. 2023. 12. 29.
티스토리 SEO를 위한 검색 등록 : 구글 서치 콘솔(google search console) 티스토리(Tistory) SEO(Search Engine Optimization)를 위한 검색 등록 구글 서치콘솔(google search console) 들어가기에 앞서 웹 사이트를 제작하고 나면 제일 먼저 진행해야 하는 것 중 하나가 검색 엔진 최적화(SEO : Search Engine Optimization)를 위한 구글 검색 엔진 등록이 아닐까 싶습니다. 예전에는 네이버와 구글 웹마스터 도구에서 진행을 했었는데 세월이 지나감에 따라 두 회사의 서비스 명칭이 변경되었네요 :P 구글 검색 등록이 필요하다면 네이버는 네이버 블로그가 상위노출 즉 검색 최적화가 되듯이 티스토리는 역시 구글 검색이 방문자 유입에 아주 중요하죠 ! 그렇기 때문에 구글 검색 봇이 내 사이트(티스토리)를 검색 할 수 있도록 검색.. 2023. 12. 28.
제이쿼리 모바일 햄버거 메뉴 jQeury mobile burger menu 제이쿼리 모바일 햄버거 메뉴 jQeury mobile burger menu 모바일 환경에서 기본으로 제공되는 햄버거 메뉴를 제이쿼리를 통해 구현해 놓았던 소스 이번 프로젝트에서는 보안 이슈도 있고 기술 블로그 하나쯤은 운영하고 싶어서 이번 기회에 끄적여 본다. 들어가기에 앞서 제이쿼리는 요즘은 많이 쓰이지 않는 자바스크립트 라이브러리 중 하나지만 유지관리나 신규 기능 같은 프로젝트를 진행하기 위해서는 알아두어야 하기 때문에 아니 잊지 않으려고 저장해 두고 있다. 많이들 알고 있듯이 개발 환경에 따라 CDN방식을 사용해도 되며, 로컬에 설치하고 사용해도 된다. ... 이번 프로젝트는 아무래도 로컬에 설치하여 진행하는 프로젝트가 될듯하다. HTML 이번 프로젝트는 아무래도 로컬에 설치하여 진행하는 프로젝트가.. 2023. 6. 24.
제이쿼리 jQuery 햄버거 메뉴 만들기 제이쿼리로 만드는 모바일 햄버거 메뉴 당연한 얘기지만 제이쿼리를 기본적으로 불러와야한다. CDN방식으로 사용하면 펜하겠지만 로딩 이슈가 있어서 서버에 올린 상태를 기반으로 코드를 작성하였다. 햄버거 메뉴란? 햄버거 메뉴(drawer menu)란 주로 앱(app) 또는 모바일 웹 상단에 네비게이션으로 사용되는 메뉴로, 여러가지 다양한 기능들을 하나의 네비게이션 안에 담을 수 있기 때문에 흔하게 사용되어왔던 방식입니다. HTML 사원 홍길동 로그아웃 메뉴01 서브메뉴01 서브메뉴02 서브메뉴03 서브메뉴04 서브메뉴05 서브메뉴06 서브메뉴07 서브메뉴08 서브메뉴09 메뉴02 휴게관리 메뉴03 정규직전환평가 메뉴04 교육정보 메뉴05 의료비지원신청 경조금 신청 예상퇴직금계산 연차현황 재증명 신청 급여명세서.. 2023. 6. 24.