전체 글 308

티스토리 코드 붙여넣기

내 티스토리블로그는 아주 다크하다.. 코드를 복붙할때 안보여서 이렇게 해놨는데 이때문에 음울한 블로그가 된듯하다.. 블로깅을 6개월정도 하고나서 이제야 방법을 알아봤다(게으름 ㅠ) 그냥 간단하다 저기 쩜쩜쩜에 코드블럭 누르고 쓰면된다. 이렇게하면 복사가능한 텍스트형식으로 코드를 쓸 수 있다. 다만 내가 vs코드에서 쓰는 코드색깔대로는 안된다. 샘플은? import { reactive } from "vue"; import { useRouter } from "vue-router"; 이로케하면된다! 단축키는 cntl + alt + , # snap shot 익스텐션 더 이쁜데 다만 사진으로 나오는거다. vs코드에서 snapshot 익스텐션을 설치후 코드 드래그 후 cntl + shift + p에서 snapsho..

etc/etcTools 2023.03.08

깃 저장소의 폴더만 삭제하기.

https://velog.io/@dailyhyun/TIL-github%EC%9D%98-%ED%8C%8C%EC%9D%BC%ED%8F%B4%EB%8D%94-%EC%82%AD%EC%A0%9C%ED%95%98%EA%B8%B0 [TIL] github의 파일/폴더 삭제하기 파일 삭제하기, 폴더 삭제하기 모두 터미널 창 또는 cmd를 켠 뒤 삭제하고자 파일/폴더가 있는 위치로 이동해서 실행하기! velog.io 2. 로컬 디렉토리에서는 삭제하지 않고 git에서만 삭제 실수로 .class 같은 커밋하지 말아야 할 파일들을 커밋하는 경우가 있다. 이런 경우 다음 명령어를 사용하면 로컬 디렉토리의 파일은 유지한 채 git에서만 삭제할 수 있다. $ git rm --cached HelloJAVA.class $ git com..

git/etc 2023.03.08

SSL인증서 만료일 확인

얼마전 aws https용 SSL인증서를 갱신해놨었다.. 근데 이런? 이메일로 인증서회사에서 메일을 3일째 보내는것이다. 만료일이 얼마안남았다고.. 그래서 다시 aws 콘솔로 들어가서 직접 커맨드상에서 certbot certificates명령어를 이용해서 만료일을 확인했는데 정상적으로 만료일이 충분히 남아있었다. 여기서 의문점! certificates 명령어가 말해준 만료일이 맞을까? 아니면 이메일로 알려준 만료일이 맞을까? 정답을 찾기위해선.. 걍 내 사이트로 들어가서 브라우저에서 받은 인증서가 어떤지 확인해보면 간단하다.. #1 내사이트 접속후 주소창 왼쪽 자물쇠를 클릭 (크롬으로 접속했다) 요렇게 자물쇠가 생겼다 #2 이연결은 안전합니다 클릭 #3 인증서가 유효함 클릭 #4 만료일 확인 만료일이 저..

etc/etcTools 2023.03.06

filezilla와 aws(light sail) 인스턴스 연결

filezilla는 인터넷보면 너무 어렵게? 설명되어있더라.. FTS인가 뭔가 하면서 그냥 단순히 내가 굴리는 서버를 filezilla라는 프로그램으로 연결해서 파일들을 직관적으로 다루게 해주는거다. 지금까지는 aws인스턴스에 접근할때 커맨드창으로 접근해서 파일을 다뤘기때문에 ls니cd니 vim에디터니..등등 사용해야했지만 filezilla로 연결하면 파일을 드래그앤드롭등으로 옮기고 쓸수있게 해준다. ##연결하기~ #1 filezilla다운로드 https://filezilla-project.org/ 여기서 클라이언트용으로 본인 컴터에 맞는걸 다운받는다. #2 aws 인스턴스 연결 저 아이콘을 클릭한다. 이렇게 창이뜨는데 여기서, - 프로토콜 : SFTP로 연결, FTP는 보안상 잘 쓰이지 않음. - 호스..

AWS/etc 2023.03.06

css우선순위, 미디어쿼리 css적용이 안될때는?

#우선순위 css를 수정하면서 미디어쿼리가 적용이 안되는 경우를 보았다. 이런경우엔 css우선순위 문제가 있을경우이다. 개발자도구에서 적용안되는 태그를 클릭해서 우선순위로 적용된걸 볼 수 있다. # 예시 / 해결방법 .class_b{ .class_a { font-size : 1em; } } 이런 클래스에 적용한 속성이 있는데, @media (max_width : 400px){ .class_a { font-size : 0.7em; } } 이렇게 모바일 환경에따라 class_a의 폰트사이즈를 적용하려고 할때, 미디어 쿼리가 적용이 안된다면? 원 css파일처럼 class_b로 감싸주면 된다. @media (max_width : 400px){ .class_b{ .class_a { font-size : 0.7em..

webStyling/design 2023.02.27

롤스토이 // 블랜딩, 비네팅, 불필요한 곳 지우기, 저장포멧

# 파일 자체에 사진 불러오기 place embedded 로 가져오면 새창 안열리고 바로 사진 덮어쓰며 불러올수 있음 # 블랜딩 모드 레이어창에 저 Lighten부분을 변경하면 됨 단축키는 쉬프트 + +or- # 비네팅 모드 사진구멍뚤린듯 하는거 이게 원본이다. 일단 이 레이어를 한번 더 복사함. 그다음 멀티플 모드로 ㄱㄱ 사진이 더 어두워짐. 그다음 셀렉션툴로 원하는 만큼 따자. 이상태에서 상단 탭을 보면 Feather값 조절하는데가 있음 0으로 하면 그냥 딱 자르는거고 올리면 오파시티 조절되면서 선택되는거인듯. 이상태에서 저 선택한만큼 잘라줘야하는데.. 단축키 delete!! 존나 중요함 응 잘렸어~ 이상태에서 cntl + D누르면 선택영역 해제됨. 더 효과를 명확히 하고싶으면 레이어를 여러개 복사하..

nginx // user agent 제어

경로 /etc/nginx/sites-available에 있는 default파일을 손보면 된다 가장 최상단 server{}안에 코드를 수정해주면 된다. # user_agent로 악성봇 차단방법 https://svrforum.com/svr/105645 서버포럼 - Nginx에서 User-agent를 통한 악성/스팸 봇 차단하기. 안녕하세요. 달소입니다. 오늘은 사이트 운영을 하면서 필수적으로 해야할 설정인 악성/스팸 봇을 차단하는 방법입니다. 대계 사이트를 운영하는경우 웹에 노출되기때문에 robot.txt를 통해 크롤 svrforum.com # nginx 연산자 https://earth-95.tistory.com/143 [NGINX] if 조건식 사용하기 if 조건식 Syntax: if (condition)..

linux/etc 2023.02.16

브라우저 개발자 도구

탭 Element : 로딩된 웹페이지의 DOM과 CSS를 편집해서 렌더링된 뷰를 확인, 단 편집한 내용이 저장되지는 않음. Console : 로딩된 웹페이지의 에러를 확인하거나 js소스코드의 console.log를 확인할수 있음. Source : 로딩된 웹페이지의 자바스크립트코드를 디버깅할수 있음. Network : 로딩된 웹페이지에 관련된 네트워크 요청 확인 Application : 웹스토리지, 세션,쿠키관리 # 콘솔 여러줄 작성하려면 쉬프트+엔터로 줄넘김 # 에러콘솔 대충 이런코드 작성하면 이렇게 증가감소하는 UI가 만들어지는데 잘작동한다. 코드에서 counter-x로 바꿔보자. 이렇게 타입에러뜬다. 없는 프로퍼티를 왜찾냐 이거임. 추가적으로 위에 js코드에서 변수지정한 num을 출력하면 값이 뜬다...

카테고리 없음 2023.02.16

시작하면서/ 자바스크립트 소개

렌더링 : HTML, CSS, Jave Script로 작성된 문서를 해석해서 브라우저에 시각적으로 출력하는것. 서버사이드렌더링 : 서버에서 데이터를 HTML로 변환해서 브라우저에 전달하는 과정 SSR (server side rendering) Node js : 자바스크립트 런타임 환경 비동기 I/O(입출력) 단일스레드 이벤트루프 기반 동작 SPA에 적합(single page Application) *CPU사용량이 높은 어플리케이션에는 권장하지 않음. ECMA Script 이크마스크립트 : ECMA-262, 자바스크립트의 표준사양 클라이언트 사이드 Web API # 자바스크립트는 개발자가 별도의 컴파일작업을 수행하지 않는 인터프리터언어. 컴파일러 언어 : - 코드가 실행되기전단계(컴파일) 타임에 소스코드 ..

프리미어프로 // 영상속도조절

이론 동영상은 사진의 연속 일반영상 초당 30FPS 사진 30장 지나가는거. # 속도조절 클립 우클릭후 speed duration 오디오피치 유지하면 음성변형 안됨. 단축키 cntl + r ripple edit 클릭하고 늘리면 다음클립 안짤라짐. 속도 점점 증가하는건 안알려주네.. # 클립내에서 속도 조절 (강의에 없음) 클립우클릭하고 영상속도를 클립에 보이게해줌. 저 하얀줄이 영상속도임. 클릭으로 위아래로 하면 속도조절됨. 이제 프레임을 끊어주자. cntl+클릭으로 끊을곳 정할수있음. 그리고 이걸 각각 조절해주면.. 속도조절 끝 https://www.youtube.com/watch?v=PfJnfGku1PE&list=PLF3xwVWbSafz0pIGP5gCZEI7xBy2u0Pco&index=33&ab_ch..