[tip] 아이디어를 떠올리기 좋은 사이트
2021. 9. 14. 20:20
programming/HTML, CSS
너무 식상한 홈페이지를 만들 때가 있습니다. 항상 보던 느낌, 비슷한 레이아웃.. 그런 아이디어를 떠올리기 좋은 사이트들이 있습니다. 1. https://www.pinterest.co.kr Pinterest 요리법, 집 꾸미기 아이디어, 영감을 주는 스타일 등 시도해 볼 만한 아이디어를 찾아서 저장하세요. www.pinterest.co.kr 다양한 아이디어를 생각하게 해주는 사이트입니다. responsive website, website, responsive website layout 등을 검색해보시면 다양한 사람들의 아이디어가 있습니다. 참고해서 구현하면 좋겠죠. 2. https://dribbble.com/ Dribbble - Discover the World’s Top Designers & Creat..
[html] 반응형 html 페이지
2021. 9. 7. 19:58
programming/HTML, CSS
예전에는 데스크톱용 홈페이지만 만들었다고 하면 지금은 다양한 디바이스가 있습니다. .left { float:left; width:50% } .right { float:right; width:50% } html에서는 예전과 달리 고정된 px을 사용하지 않고 Flex grid %, Flex box vw, vh를 사용해서 구현합니다. 추가로 css에서 Media Queries를 이용해 모바일, 태블릿, 데스크톱 화면을 어떻게 보여줄 것인지 구성할 수 있습니다. 그래서 데스크톱, 태블릿, 모바일 화면을 생각하면서 만들어야 합니다. @media screen and (min-widht: 800px) { .container { widht: 50%; } }
[html] html 기본
2021. 8. 21. 14:15
programming/HTML, CSS
html은 브라우져에서 실행 가능한 가장 기본적인 파일입니다. - 상위태그 head -> 상세 설명이 들어가는 태그 body -> 사용자에게 보여지는 태그들로 이루어져 있는 태그 참고 사이트 https://developer.mozilla.org/ko/ MDN Web Docs The MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps. developer.mozilla.org 전세계의 많은 웹개발자들이 확인하고 예제를 통해서 배우는 곳입니다. (html, css, javascript 등) * 예전에는 div로 ..
[git] github push 해보기
2021. 8. 17. 15:11
programming/Git
1. github 회원 가입하기 github 공식 홈페이지에 회원가입을 해줍니다. (이미 가입되어 있으신 분은 로그인!) 회원 가입은 오른쪽 상단에 sign up을 누르시고 이메일 주소, 비밀번호를 입력해주시면 간편하게 가입이 가능합니다. 2. github Repositories 만들기 로그인 -> 왼쪽 상단에 Repositories 옆에 new를 눌러서 새로운 Repositories를 만들어 줍니다. Repository name을 지정해주시고 공개하실 건지 비공개인지 체크해주시고 추가할 부분을 눌러주신 다음 create repository를 눌러서 만들어줍니다. 3. repository clone 새롭게 생성된 repository 오른쪽 상단에 code를 클릭하시면 https라고 적혀있습니다. 그 부분..
[iTerm2 ] iTerm2 세팅하기!
2021. 8. 15. 10:19
programming/Git
개발자라면 다 사용할 거 같은 iTerm2입니다. 보기 좋게 설정할 예정인데요 먼저 iterm2 가 없으신 분은 설치를 해주세요. 1. 설치하기 https://iterm2.com iTerm2 - macOS Terminal Replacement iTerm2 by George Nachman. Website by Matthew Freeman, George Nachman, and James A. Rosen. Website updated and optimized by HexBrain iterm2.com 접속하셔서 iTerm2를 설치해 줍니다. 설치가 완료되셨으면 실행하고 /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HE..
[Git] Git Setup
2021. 8. 7. 17:52
programming/Git
Git은 명령어를 기본으로 한 명령어 프로그램. 터미널에서 커맨드로 배워야지 Git을 정확하게 사용하는 방법을 익힐 수 있다. https://www.git-scm.com Git www.git-scm.com 공식 홈페이지에서 UI도 다운로드 가능. 터미널 + SourceTree(UI는 클래식함)를 전반적으로 이용. (Github Desktop은 비추) - 터미널을 이용하는 게 기능을 최대한 활용할 수 있음. 현업에서 일하는 개발자들은 명령어를 이용해서 사용하는 경우가 많다. Git의 전반적인 내용을 잘 이해하고 잘 활용할 수 있으면 SourceTree만 사용하는 것도 나쁘지 않다고 생각함. git init (초기화) 하면 앞에 master(branch)라고 붙음. ls -al // 폴더 안에 있는 모든 파..
[basic] Markdown
2021. 8. 2. 12:00
programming/HTML, CSS
Git 에서 Readme를 작성할 때 Markdown으로 작성을 한다고 해서 Markdown을 배워보고자 포스팅하였습니다. 기본적인 markdown - # 에 h1은 밑에 라인이 자동으로 생긴다. - #은 1개부터 6개까지 적용 가능 - 라인을 추가할 때는 언더바(_) 3개 - quote는 > (이건 뭔가요? 에서 적용) - 링크와 이미지는 같은 방식 : click [링크](주소), ![이미지설명](이미지주소) - table의 정렬은 : 위치가 중요함. : |:--|:--|:--|
[Emmet] Emmet 빠르게 마크업 하기 2
2021. 8. 1. 02:58
programming/HTML, CSS
- 그룹화 하기에는 () 를 사용한다. 위 이미지를 참고하면 div 안에 header가 있고 그 안에 ul가 있다. li 안에 a 태그가 7번 반복, header 옆에 footer가 있다. div>(header>ul>li*7>a)+footer>p 저렇게 입력하면 - 텍스트 입력하기 텍스트를 입력하기 위해서는 {} 를 사용하면 된다. 만약에 P태그 안에 Text area 라는 텍스트를 적고 싶다면 p>{text area} 라고 입력하면 된다. - 숫자를 자동으로 입력하기 위해서는 $ 사용 class 이름이 "class 숫자" 라는 p 태그 안에 "text 숫자" 라는 텍스트가 들어가는게 5번 반복되는 태그를 작성한다고 치면 (글로 표현하기가 좀 어려움) p.class${text $}*5라고 입력하면 된다...