TIL_2023_09_18

dataliteracy·2023년 9월 18일

TodayILearned

Today_I_Learned

목록 보기

88/112

TIL_2023_09_18

Today 요약

자바스크립트 공부
슈퍼코딩

1. What I did?

1.1 슈퍼코딩

오늘은 첫 날이다. 2팀으로 배정받았고, 팀원들이랑 잠깐 이야기를 나눌 시간이 있었다. 대부분 공부를 시작한 지 얼마되지 않은 사람들이 많았다. 아무래도 부트캠프다 보니까 그런 것 같다. F-Lab을 했을 때와는 사뭇 다른 분위기다. 일단 1~2주차는 10시부터 10시까지 하는 패턴에 익숙해지고, 3주차부터 본격적으로 한다고 생각하고 임하자. (그렇다고 1~2주차를 대충한다는 건 아니다.) 오늘은 대충 아래와 같이 진행했다. 강의는 듣지 않았다.

데일리 스크럼 겪어보기
- 9월 기수의 대부분의 사람들이 모여서 데일리 스크럼을 진행했는데, 앞으로도 매일 모든 사람들이 한 꺼번에 데일리 스크럼을 진행한다면 약간 비효율적일 것 같다. (체크업도 마찬가지..)
슈퍼코딩 과정에 대해 궁금한 거 물어보기
- 블로그는 반드시 네이버로 작성해야 하는지? (그래야 한다고 함..)
- 동아리 신청은? (동아리를 추가로 개설해도 되고 기존 동아리에 들어가도 된다고 함.. 조만간 공지..)
정기 팀 회의 경험해보기
- 슈퍼코딩 측에서 뭔가 강력하게 틀을 잡아서 하는 것 같지는 않고 CTO와 팀이 협력해서 스스로 팀 회의를 이끌어나가야 하는 것 같음.
라이브 코딩 경험해보기
- 라이브 코딩이라고 해서 누군가 멘토가 라이브로 코딩하는 걸 보는 줄 알았는데, 주로 질의응답과 한 가지 주제를 가지고 멘토가 멘티들에게 이야기 해주는 형식으로 진행되었다.

2. What I Learned?

2.1 자바스크립트 공부

Ajax

웹페이지를 리로드하지 않고 비동기적으로 서버와 데이터를 교환해서 페이지의 일부분만 변경할 수 있는 기술

보통 JSON 형태로 데이터를 주고 받는다.

2.2 슈퍼코딩 데일리 과제

IDE란?
- 통합 개발 환경
head 태그의 역할?
- meta 정보를 등록하거나 style태그 script 태그를 이용해 css 코드나 자바스크립트 코드를 등록하기도 하고 title을 명시해서 SEO 최적화에 도움이 되도록 하게 하기도 한다.
시멘틱 태그란?
- 웹페이지를 좀 더 구조적으로 의미있는 이름을 이용해서 구성하고 싶을 때 사용한다.
- header, nav, article, section 등의 태그가 있다.
input태그의 type에는 어떤 것들이 있는지?
1. text: 텍스트 입력 필드를 생성합니다. 사용자는 문자열을 입력할 수 있습니다.
2. password: 비밀번호를 입력하는 필드로, 입력한 값이 마스킹됩니다.
3. number: 숫자를 입력할 수 있는 필드로, 숫자 형식의 값을 받습니다.
4. email: 이메일 주소를 입력하는 필드로, 이메일 유효성 검사를 수행합니다.
5. tel: 전화번호를 입력하는 필드로, 전화번호 형식을 따르는 값을 받습니다.
6. date: 날짜를 입력하는 필드로, 달력 형식의 날짜 선택이 가능합니다.
7. time: 시간을 입력하는 필드로, 시간 형식의 값을 받습니다.
8. checkbox: 다중 선택이 가능한 체크 박스를 생성합니다.
9. radio: 단일 선택만 가능한 라디오 버튼을 생성합니다.
10. file: 파일 업로드 필드로, 사용자는 파일을 선택할 수 있습니다.
11. submit: 폼을 제출하는 버튼을 생성합니다.
12. reset: 폼의 내용을 초기화하는 버튼을 생성합니다.
13. button: 사용자 지정 기능을 수행하는 버튼을 생성합니다.
14. color: 색상 선택 필드로, 색상 선택이 가능합니다.
15. range: 범위를 나타내는 슬라이더를 생성합니다.
  
  인상적인건 input 태그로 색상도 선택이 가능하다는 점이다.
  
  다른 것들은 잘 알고 있거나, 어렴풋이 알고 있었던 것들인데, color는 이번에 찾아보면서 처음 알게 되었다.

HTML에 CSS를 넣을 수 있는 3가지 방법과 우선순위

HTML 태그에 inline으로 넣는 방법
style태그에 직접 css코드를 작성하는 방법
link 태그에 css 파일을 연결하는 방법
우선순위는 1 > 2> 3 순서대로

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="test.css" />
    <style>
      body {
        background-color: red;
      }
    </style>
    <title>Document</title>
  </head>
  <body style="background-color: green"></body>
</html>