본문 바로가기

전체 글

 (80)
[css] css 각종 수치 꿀팁 사이트 (box-shadow/text-shadow/gradient 쉽고 정확하게 넣기) 개인적으로 빠른 퍼블리싱도 어느정도 템빨이라고 생각합니다. 디자인을 포토샵으로 받아, box-shadow를 넣을라치면, 일일이 계산하기 힘듭니다. (물론 피그나마 제플린 같은 툴을 쓴다면 굳이 이 사이트를 찾을필요가 없겠지만, 포토샵기준으로 작업을 해야하는 분을 위해,, ) 그런 복잡한 계산을 해결해줄 아주 좋은 사이트를 소개합니다. * box-shadow/text-shadow 정확하게 넣기 http://psd-to-css-shadows.com/ Convert Photoshop Drop Shadows to CSS3 Box and Text Shadows CSS3 Code box-shadow: offset-x offset-y blur-radius spread-radius rgba(0, 0, 0, opacit..
[기타 꿀팁]각종 기기 해상도 및 뷰포트 사이즈 알수있는 사이트 퍼블리싱 작업을 하다보면, 작업기준을 어떻게 잡아야할지, 특정 기기에서 화면이 틀어져 보이는데, 대체 이 기기의 해상도는 얼마인지 궁금할때가 많습니다. 이런 상황에 아주아주 이용할수있는 유용한 사이트 몇가지를 소개합니다. *각종 기기 해상도를 알수있는 사이트 https://gs.statcounter.com/screen-resolution-stats/ Screen Resolution Stats Worldwide | Statcounter Global Stats This graph shows the stats of screen resolutions worldwide based on over 10 billion monthly page views. gs.statcounter.com 각종 기기의 점유율을 파악할수있..
[노마드 React - 영화앱만들기] 7. Practice Movie App - Coin Tracker(feat. #7.2 Coin Tracker) import { useEffect, useState } from "react"; function App() { const [loading, setloading] = useState(true); const [coins, setCoins] = useState([]); useEffect(() => { fetch('https://api.coinpaprika.com/v1/tickers').then((response) => response.json()) .then((json) => { setCoins(json); setloading(false); }); },[]) // this code works only once return ( The Coins! {loading ? "" : `(${coins.length})`}..
[git] git 명령어 모음 명령어 설명 git git 정보 확인. - git설치 후, git 이 잘 설치 되었는지 확인가능 pwd 현재 폴더 경로 확인 ls -al 현재 폴더에 있는 파일 목록을 알려준다. mkdir 폴더명 폴더를 만들기 nano 파일명 파일 만들기 rm 파일명 파일 삭제 cd 폴더명 폴더로 접근 git init git 초기화 git status 현재 git 상태를 확인. git log 커밋한 내역 확인 git log --stat 각 커밋에 어떤 파일들이 연루되었는지 알려준다. git log -p 모든 커밋의 변경사항을 알려준다. git log --all --graph --oneline --all : 모든 브랜치 노출 --graph : 시각적으로 보임 --oneline : 버전들을 한줄로 나오게함 cat 파일명 파..
[생활코딩_GIT] 08. vs code로 다루는 git - #4. 작업취소 #방법 1. 왼쪽 git 탭클릭 - changes 에 안에 수정할 파일 마우스 오버 - discard changes (화살표 아이콘) 클릭! 하면 간단하게 작업내용을 취소할 수 있다.
[생활코딩_GIT] 08. vs code플러그인 추천 - #3. git graph # 설치 방법 및 사용방법 1. 왼쪽 확장프로그램 아이콘 클릭 - git graph 검색 - 설치 2. 설치시 하단에 git graph 버튼이 생김. 이를 클릭해서 로그 보면된다! 3. 로그를 아래와 같이 시각적으로 표현해줘서 깃 로그를 한눈에 이해하기 좋다.
[생활코딩_GIT] 08. vs code로 다루는 git - #2. 버전 만들기 (커밋하기) 1. 나의 작업이 완료되어, 버전 생성을 생성하고 싶다면, 왼쪽 git tab에 들어가서, 변경하고 싶은 파일을 +버튼을 눌러 추가한다. 2. 스테이징된 변경사항에 파일을 집어넣었으면, 이 파일의 수정사항에 맞는 커밋 메세지를 작성하고, 상단 체크버튼을 눌러주면 커밋 완료! 3. [보기 - 터미널] 시 나타나는 입력창에서 git log 를 입력하면, 커밋 결과를 확인 할수있다. 아래 사진에서 work 커밋 내용을 확인할수있다!
[생활코딩_GIT] 08. vs code로 다루는 git - #1. 프로젝트 만들기 #1. 프로젝트 만들기 1. [파일 - 폴더 열기] 를 클릭 하여, 프로젝트를 관리 할 폴더를 연다 2. 오른쪽 git tab을 클릭한 후, 레파지토리 초기화 버튼을 클릭한다. 3. [파일 - 기본설정 - 설정] 에 들어간뒤, 상단 검색창에 exclude 검색 해서 하단 .git 을 삭제한다.( x버튼 클릭 ) 4. 파일 탭에 들어가서 .git 이 설치되어있는 것을 알 수있다. 5. 만약 이 폴더를 백업하고 싶다면?!! 폴더 자체를 copy해놓는다!

티스토리툴바