<Day 2 보충>
fragment
: 페이지내에 section요소가 id를 갖고 있을 때
주소 + #id -> id로 이동 가능
ul>(li>a)*3 -> 많이 사용하는 emmet
Git
(master) vs GitHub
(main, 형상관리 시스템 중 하나)
컴퓨터 ==commit==> Git
==push==> GitHub
✔ Git설치 후 Gitbash에서 설정
1. git config --global user.name "이름" -> 이름 설정(GitHub에 설정된)
2. git config --global user.email 이메일 -> 이메일 설정(GitHub에 설정된)
git config user.name (user.email) -> 설정된 이름(이메일) 확인
3. mkdir 파일명 -> 디렉토리 만들기
4. cd 파일명 -> 생성한 디렉토리로 이동하기
5. git init -> 현재 디렉토리를 Git 저장소로 만들기
6. ls -al
⭐많이 쓰는 명령어
✔ CLI명령어
✔ GitHub에서 파일 만들기
new 또는 new repository - add a readme file(선택 안하면 직접 만들어야함)
README파일 수정하기
README.md - 연필모양 클릭 - 수정
GitHub에서 vsc열기
https://github.dev/
로 변경.
<iframe>
: 현재 HTML페이지에서 다른 HTML페이지를 보여주고 싶을 때 사용한다. 페이지에서 소스코드 가져오기
<iframe width="300px" height="300px" src="http://www.daum.net" frameborder="0"></iframe>
<audio>
: 음악 컨텐츠를 재생한다.
<audio controls autoplay loop class="bgm">
<source src="절대경로" type="audio/mp3">
</audio>
<video>
: 동영상 파일을 재생한다. - 트래픽 주의 (youtube 사용)
<video controls width="250">
<source src="절대경로.webm" type="video/webm">
<source src="절대경로.mp4" type="video/mp4">
Sorry, your browser doesn't support embedded videos.
</video>
*참고
스크린리더가 alt값에 따라 img태그를 읽을 때
<img src="123.png" alt=""> <!-- 안 읽음 -->
<img src="123.png" alt=" "> <!-- 파일명 읽음 -->
<img src="123.png"> <!-- 파일명 읽음 -->
vimeo-인프런에서 사용하는 유료 스트리밍 서버
autoplay는 mute속성과 함께 사용 -> 접근성 측면에서 좋지 않음
<Form>
: 정보를 입력하는 영역
method="get"
: url로서 페이지 요청을 보낸다. 주소에 데이터를 입력
<form action="입력 값을 전송할 페이지" method="get">
<input type="text" name="userId">
<input type="password" name="userPw">
<button type="submit">로그인</button>
</form>
?userId (key) =minyoung (value) &userPw=123 -> 쿼리스트링
method="post"
: url이 아닌 body값을 보낸다.
Create(게시물 생성)할 때 url에 정보가 뜨지 않는다. ex)이미지, 유저의 아이디 생성 시
<form action="http://localhost:8080/" method="post">
<input type="text" name="userId">
<input type="password" name="userPw">
<button type="submit">로그인</button>
</form>
✔ input의 속성
<form action="form의_종류.html" method="get">
<input type="text" name="userId"><br>
<input type="password" name="userPw"><br>
<input type="checkbox" name="" id=""><br>
<!-- 무언가를 설명할 때 label사용 -->
<label for="men">남</label>
<input type="radio" name="성별" id="man">
<label for="female">여</label>
<input type="radio" name="성별" id="female"><br>
<input type="color" name="" id=""><br>
<input type="date" name="" id=""><br>
<input type="datetime" name="" id=""><br>
<input type="email" name="" id=""><br>
<input type="tel" name="" id=""><br>
<input type="hidden" name="" id=""><br>
<input type="range" name="" id=""><br>
<input type="number" name="" id=""><br>
<input type="url" name="" id=""><br>
<input type="file" name="" id=""><br>
<button type="submit">로그인</button>
<!-- 사용자의 입장에서 선택하기 -->
</form>
(참고)
youtube에서 비디오 빠르게 재생하는 법
-> 콘솔창에 document.getElementsByTagName("video")[0].playbackRate = 2; (2배속)
마이크로 서비스 - 다수의 서버
모놀리식 아키텍처 - 하나의 서버
2022.03.31
잘하고계시네요 🍀 화이팅 💕💕