1일차 23.02.07 velog에 쓴 글 이사
- 오늘 목표 : 웹개발 종합반 1일치 수강, SQL 1일치 수강 (완료)
- 배운 것
웹개발
1. 브라우저의 역할 & 웹의 동작 원리
: 브라우저가 서버에 필요한 동작을 요청 -> 서버가 html,css,js를 제공
-> 브라우저가 받아서 사용자게에 보여줌
2. 새로고침을 하기전까지 사용자가 임의로 브라우저를 고칠 수 있는 이유?
서버가 html,css,js 등을 api를 통해 브라우저에 주고나면 내 컴퓨터에 이미 받아와서
다운로드가 됐기 때문.
SQL
01. 데이터베이스와 SQL의 필요성
: 데이터 양이 많아지면 엑셀이 느려지고 내용이 충돌되는 문제 발생
데이터베이스에 내가 원하는 형태로 가지고 올 수 있게 SQL 사용
- DB에 명령을 내리려면 사용자와 DB 사이 약속된 규칙 혹은 언어가 필요
=> SQL
; Structured Query Language의 약자로 데이터베이스에 요청(Query)를 보내 원하는
데이터를 가져오는 것을 도와주는 언어
📚 데이터베이스를 이용해서 사용자들의 데이터를 저장할 경우의 장점
1) 방대한 양의 데이터 저장
2) 방대한 양의 데이터에서 내가 원하는 정보를 신속하게 가져오기
<데이터베이스 기초개념>
여러 사람들이 같이 사용할 목적으로 데이터를 담는 통(보관함)
-> 데이터를 쌓아두는 것이아닌, 데이터를 잘 꺼내오기 위함!
C (Create): 데이터의 생성
R (Read): 저장된 데이터를 읽어오는 것
U (Update): 저장된 데이터 변경
D (Delete): 저장된 데이터 삭제
<Select 쿼리문>
쿼리문이란?
쿼리(:질의) , 데이터베이스에 명령을 내리는 것
Select 쿼리문
:데이터베이스에서 데이터를 선택해서 가져옴
point!
1) 어떤 테이블에서 2) 어떤 필드의 데이터를 가져올지
- 테이블 : 데이터가 담긴 엑셀시트
- 필드(칼럼) : 데이터베이스(엑셀시트)에서 세로방향으로 표시된 column
- 쿼리문 작성 꿀팁!
1) show table을 이용해 테이블 살펴보기
2) 원하는 정보가 들어있을 것 같은 테이블에 select * from 테이블명 쿼리 작성
3) 원하는 테이블에 조건을 걸 필드를 찾기
4) 조건에 맞는 where문 작성
💡 where문과 자주 쓰이는 문법
!= 같지 않음을 나타냄, 제외할 때 사용
between 범위 조건
in (포함할 조건)
like '%내용' 패턴 조건(문자열 규칙을 설정할 때 사용)
=> %가 지칭된 내용은 제외하고 찾을 수 있도록 함
ex) where email like 'b%com' :email 필드값이 b로 시작,com으로 끝나는 데이터
Limit 일부 데이터만 가져옴 => 방대한 데이터를 잠깐만 보려고 할 때 유용
Distinct 중복 제외
Count 카운트 기능
- Distinct와 Count 같이 쓰기 (응용)
<사이트 회원의 성씨 개수 세기> - select distinct(name) from users; // 결과 : 성씨 나열 select count(distinct(name)) from users // 성씨 개수 count
-수강평 : SQL 강의는 처음이었지만 흥미롭게 들었다.
2일차
- 오늘 목표 : 웹개발 종합반 2일차 수강, SQL 2일차 수강 (완료)
- 배운 것
(웹개발)
<로그인 페이지 만들기 (css inline style ver.)>
1. 꾸미기(CSS)위해서는 지정이 필요하기 때문에 class로 꾸밀 곳을 지정(이름표 달기)
style tag 안에서 선택자를 사용해 이름표를 가리킴
선택자는 . * 등을 얘기하는 것임
2. 박스를 꾸밀 때 background-color 먼저 지정해서
박스 공간 확인 겸 박스가 씌워졌는지 check
3. 여백 margin(바깥쪽), padding(안쪽) => 시계방향으로 px 지정
로그인 페이지
아이디, 비밀번호를 입력하세요
ID :
PW :
<style>
@import url('https://fonts.googleapis.com/css2?family=Hahmlet:wght@400;500;600;700&family=Jua&display=swap');
* {
font-family: 'Jua', sans-serif;
}
.mytitle {
background-color: green;
width: 300px;
height: 200px;
border-radius: 10px;
color: white;
text-align: center;
padding: 30px 0 0 0;
/* padding-top: 30px과 같은 의미 */
background-image: url('https://www.ancient-origins.net/sites/default/files/field/image/Agesilaus-II-cover.jpg');
background-position: center;
background-size: cover;
}
.wrap {
width: 300px;
margin: 20px auto 0px auto;
}
</style>
</head>
<body>
<div class="wrap">
<div class="mytitle">
<h1>로그인 페이지</h1>
<h5>아이디, 비밀번호를 입력하세요</h5>
</div>
<p>ID : <input type="text"></p>
<p>PW : <input type="text"></p>
<button>로그인하기</button>
</div>
</body>
*shift+alt+f : vscode 정렬
<폰트, 주석 - 구글 웹 폰트 >
- 마음에 드는 폰트 클릭, Select 후 @import 복사해서 html style태그 바로밑에 붙여넣기
css에도 font-family 복붙
(SQL)
궁금한 것 : 세미콜론 붙을경우?
-> 쿼리 마다의 구분을 할 때 사용할 수도 있다. 굳이 안써도 됨
큰 따옴표, 작은 따옴표의 사용 구분 ?
-> (추후 작성)
<SQL;2주차 강의>
- 통계, 통계 구하기, Group by, Order by
=> 데이터베이스 테이블에 저장된 날것의 쌓여있는 데이터를 의미있는 '정보'로 변환
1.Group by : 동일한 범주의 데이터를 묶어 줌 (범주의 통계를 내준다)
count, min, max, avg, round(,반올림 자리 수), sum 문법과 사용
예시)
select name, count(*) from users
group by name;
*실행순서
from -> group by -> select
(1) users 테이블 전체 가져옴
(2) name 필드 데이터를 묶어줌
(3) name에 따라 묶어진 데이터가 몇 개가 묶어졌는지 세어줌
2.Order by : 데이터 정렬
맨 마지막에 실행, 정렬할 필드명을 적어줌 (디폴트는 오름차순/ desc : 내림차순)
select * from 테이블명
order by 정렬의 기준이 될 필드명;
ex)like를 많이 받은 순서대로 '오늘의 다짐'을 출력
select * from checkins
order by likes desc;
3.쿼리를 작성할 때의 팁
-테이블을 먼저 살핀 후 원하는 정보가 있을 것 같은 테이블에 select * from table이름 limit 10으로 쿼리를 날려서 정보가 있는지 확인
-테이블을 찾았다면 범주를 나눠서 보고싶은 필드를 찾고, 범주별로 통계를 보고싶은 필드를 찾는다.
-마지막으로 SQL 쿼리를 작성한다.
=> SQL은 실행순서를 잘 알아두고 중요도가 높다는 것을 인지하면서 작성하자
<별칭기능 : Alias>
테이블이 길어졌을 때 혼동을 방지하도록 하는 별칭 기능
ex 1) select * from orders o
where o.course title = '앱개발 종합반'
ex 2) count(*) as cnt : as뒤에 따라오는 cnt가 별칭
-수강평 : SQL을 좀 더 깊게 알아봤다. 실행순서가 정말 중요하다고 한다. 2주차 강의를 듣고나서 스스로 여러번 실습을 해보고 문제를 푸는 것이 실력향상에 제일 도움될 것 같다.
'내일배움캠프 > 내일배움단' 카테고리의 다른 글
내일배움단 -개발일지 2주차 (3) (0) | 2023.03.08 |
---|---|
내일배움단 -개발일지 2주차 (2) (0) | 2023.03.08 |
내일배움단 -개발일지 2주차 (1) (0) | 2023.03.08 |
내일배움단 - 개발일지 1주차(3) (2) | 2023.03.08 |
내일배움단 - 개발일지 1주차(2) (0) | 2023.03.08 |
1일차 23.02.07 velog에 쓴 글 이사
- 오늘 목표 : 웹개발 종합반 1일치 수강, SQL 1일치 수강 (완료)
- 배운 것
웹개발
1. 브라우저의 역할 & 웹의 동작 원리
: 브라우저가 서버에 필요한 동작을 요청 -> 서버가 html,css,js를 제공
-> 브라우저가 받아서 사용자게에 보여줌
2. 새로고침을 하기전까지 사용자가 임의로 브라우저를 고칠 수 있는 이유?
서버가 html,css,js 등을 api를 통해 브라우저에 주고나면 내 컴퓨터에 이미 받아와서
다운로드가 됐기 때문.
SQL
01. 데이터베이스와 SQL의 필요성
: 데이터 양이 많아지면 엑셀이 느려지고 내용이 충돌되는 문제 발생
데이터베이스에 내가 원하는 형태로 가지고 올 수 있게 SQL 사용
- DB에 명령을 내리려면 사용자와 DB 사이 약속된 규칙 혹은 언어가 필요
=> SQL
; Structured Query Language의 약자로 데이터베이스에 요청(Query)를 보내 원하는
데이터를 가져오는 것을 도와주는 언어
📚 데이터베이스를 이용해서 사용자들의 데이터를 저장할 경우의 장점
1) 방대한 양의 데이터 저장
2) 방대한 양의 데이터에서 내가 원하는 정보를 신속하게 가져오기
<데이터베이스 기초개념>
여러 사람들이 같이 사용할 목적으로 데이터를 담는 통(보관함)
-> 데이터를 쌓아두는 것이아닌, 데이터를 잘 꺼내오기 위함!
C (Create): 데이터의 생성
R (Read): 저장된 데이터를 읽어오는 것
U (Update): 저장된 데이터 변경
D (Delete): 저장된 데이터 삭제
<Select 쿼리문>
쿼리문이란?
쿼리(:질의) , 데이터베이스에 명령을 내리는 것
Select 쿼리문
:데이터베이스에서 데이터를 선택해서 가져옴
point!
1) 어떤 테이블에서 2) 어떤 필드의 데이터를 가져올지
- 테이블 : 데이터가 담긴 엑셀시트
- 필드(칼럼) : 데이터베이스(엑셀시트)에서 세로방향으로 표시된 column
- 쿼리문 작성 꿀팁!
1) show table을 이용해 테이블 살펴보기
2) 원하는 정보가 들어있을 것 같은 테이블에 select * from 테이블명 쿼리 작성
3) 원하는 테이블에 조건을 걸 필드를 찾기
4) 조건에 맞는 where문 작성
💡 where문과 자주 쓰이는 문법
!= 같지 않음을 나타냄, 제외할 때 사용
between 범위 조건
in (포함할 조건)
like '%내용' 패턴 조건(문자열 규칙을 설정할 때 사용)
=> %가 지칭된 내용은 제외하고 찾을 수 있도록 함
ex) where email like 'b%com' :email 필드값이 b로 시작,com으로 끝나는 데이터
Limit 일부 데이터만 가져옴 => 방대한 데이터를 잠깐만 보려고 할 때 유용
Distinct 중복 제외
Count 카운트 기능
- Distinct와 Count 같이 쓰기 (응용)
<사이트 회원의 성씨 개수 세기> - select distinct(name) from users; // 결과 : 성씨 나열 select count(distinct(name)) from users // 성씨 개수 count
-수강평 : SQL 강의는 처음이었지만 흥미롭게 들었다.
2일차
- 오늘 목표 : 웹개발 종합반 2일차 수강, SQL 2일차 수강 (완료)
- 배운 것
(웹개발)
<로그인 페이지 만들기 (css inline style ver.)>
1. 꾸미기(CSS)위해서는 지정이 필요하기 때문에 class로 꾸밀 곳을 지정(이름표 달기)
style tag 안에서 선택자를 사용해 이름표를 가리킴
선택자는 . * 등을 얘기하는 것임
2. 박스를 꾸밀 때 background-color 먼저 지정해서
박스 공간 확인 겸 박스가 씌워졌는지 check
3. 여백 margin(바깥쪽), padding(안쪽) => 시계방향으로 px 지정
로그인 페이지
아이디, 비밀번호를 입력하세요
ID :
PW :
<style>
@import url('https://fonts.googleapis.com/css2?family=Hahmlet:wght@400;500;600;700&family=Jua&display=swap');
* {
font-family: 'Jua', sans-serif;
}
.mytitle {
background-color: green;
width: 300px;
height: 200px;
border-radius: 10px;
color: white;
text-align: center;
padding: 30px 0 0 0;
/* padding-top: 30px과 같은 의미 */
background-image: url('https://www.ancient-origins.net/sites/default/files/field/image/Agesilaus-II-cover.jpg');
background-position: center;
background-size: cover;
}
.wrap {
width: 300px;
margin: 20px auto 0px auto;
}
</style>
</head>
<body>
<div class="wrap">
<div class="mytitle">
<h1>로그인 페이지</h1>
<h5>아이디, 비밀번호를 입력하세요</h5>
</div>
<p>ID : <input type="text"></p>
<p>PW : <input type="text"></p>
<button>로그인하기</button>
</div>
</body>
*shift+alt+f : vscode 정렬
<폰트, 주석 - 구글 웹 폰트 >
- 마음에 드는 폰트 클릭, Select 후 @import 복사해서 html style태그 바로밑에 붙여넣기
css에도 font-family 복붙
(SQL)
궁금한 것 : 세미콜론 붙을경우?
-> 쿼리 마다의 구분을 할 때 사용할 수도 있다. 굳이 안써도 됨
큰 따옴표, 작은 따옴표의 사용 구분 ?
-> (추후 작성)
<SQL;2주차 강의>
- 통계, 통계 구하기, Group by, Order by
=> 데이터베이스 테이블에 저장된 날것의 쌓여있는 데이터를 의미있는 '정보'로 변환
1.Group by : 동일한 범주의 데이터를 묶어 줌 (범주의 통계를 내준다)
count, min, max, avg, round(,반올림 자리 수), sum 문법과 사용
예시)
select name, count(*) from users
group by name;
*실행순서
from -> group by -> select
(1) users 테이블 전체 가져옴
(2) name 필드 데이터를 묶어줌
(3) name에 따라 묶어진 데이터가 몇 개가 묶어졌는지 세어줌
2.Order by : 데이터 정렬
맨 마지막에 실행, 정렬할 필드명을 적어줌 (디폴트는 오름차순/ desc : 내림차순)
select * from 테이블명
order by 정렬의 기준이 될 필드명;
ex)like를 많이 받은 순서대로 '오늘의 다짐'을 출력
select * from checkins
order by likes desc;
3.쿼리를 작성할 때의 팁
-테이블을 먼저 살핀 후 원하는 정보가 있을 것 같은 테이블에 select * from table이름 limit 10으로 쿼리를 날려서 정보가 있는지 확인
-테이블을 찾았다면 범주를 나눠서 보고싶은 필드를 찾고, 범주별로 통계를 보고싶은 필드를 찾는다.
-마지막으로 SQL 쿼리를 작성한다.
=> SQL은 실행순서를 잘 알아두고 중요도가 높다는 것을 인지하면서 작성하자
<별칭기능 : Alias>
테이블이 길어졌을 때 혼동을 방지하도록 하는 별칭 기능
ex 1) select * from orders o
where o.course title = '앱개발 종합반'
ex 2) count(*) as cnt : as뒤에 따라오는 cnt가 별칭
-수강평 : SQL을 좀 더 깊게 알아봤다. 실행순서가 정말 중요하다고 한다. 2주차 강의를 듣고나서 스스로 여러번 실습을 해보고 문제를 푸는 것이 실력향상에 제일 도움될 것 같다.
'내일배움캠프 > 내일배움단' 카테고리의 다른 글
내일배움단 -개발일지 2주차 (3) (0) | 2023.03.08 |
---|---|
내일배움단 -개발일지 2주차 (2) (0) | 2023.03.08 |
내일배움단 -개발일지 2주차 (1) (0) | 2023.03.08 |
내일배움단 - 개발일지 1주차(3) (2) | 2023.03.08 |
내일배움단 - 개발일지 1주차(2) (0) | 2023.03.08 |