Skip to content

1310박시현 과제 제출 #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
s1hyun2 wants to merge 3 commits into
base: main
Choose a base branch
from
Open

1310박시현 과제 제출 #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0736ba7
Update README.md
Bae0203 Aug 22, 2023
83d4b28
:: CNS 과제
s1hyun2 Aug 27, 2023
b1228f0
1310박시현 과제 제출
s1hyun2 Aug 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
130 changes: 130 additions & 0 deletions 1310/CNS Project 1/Sign_in.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html,
body {
width: 100%;
height: 100%;
}
a {
cursor: pointer;
text-decoration-line: none;
}
.background {
width: 100%;
height: 650px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.nav {
width: 100%;
height: 50px;
top: 0;
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
position: fixed;
display: flex;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.navCns {
width: 35%;
color: #1485ee;
text-align: center;
font-size: 20px;
font-weight: 700;
position: relative;
}
.navSignIn {
width: 35%;
color: #000;
font-size: 12px;
text-align: right;
position: relative;
}
.navSignUp {
width: 10%;
color: #000;
font-size: 12px;
text-align: right;
position: relative;
}
.main {
width: 300px;
height: 380px;
border-radius: 1%;
border: 1px solid #c1c1c1;
display: flex;
flex-direction: column;
align-items: center;
}
.mainHead {
width: 100%;
height: 40%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.mainHeadTitle1 {
color: #1485ee;
font-size: 13px;
font-weight: 700;
}
.mainHeadTitle2 {
font-size: 20px;
font-weight: 700;
}
.mainBody {
width: 80%;
height: 30%;
display: flex;
flex-direction: column;
}
.mainBodyLbl {
color: #1485ee;
font-size: 4px;
font-weight: 700;
}
.mainBodyInput {
width: 100%;
height: 50%;
border-radius: 5px;
border: 1px solid #c1c1c1;
padding: 4%;
}
.mainBodyInput::placeholder {
color: #909090;
font-size: 10px;
font-weight: 700;
}
.mainFoot {
width: 100%;
height: 15%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-evenly;
}
.mainFootBtn {
width: 110px;
height: 50%;
color: #fff;
font-size: 12px;
font-weight: 700;
border-radius: 50px;
background-color: #1485ee;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.mainFootAccount {
color: #1485ee;
font-size: 1px;
font-weight: 500;
}
59 changes: 59 additions & 0 deletions 1310/CNS Project 1/Sign_in.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./Sign_in.css" />
<title>CNS Project 1</title>
<script>
localStorage.setItem("sihyun", "password");
function Scccess() {
let ID = document.getElementById("Id").value;
let PW = document.getElementById("Pw").value;

if (localStorage.getItem(ID) == PW) {
alert("로그인 성공");
} else {
alert("로그인 실패");
}
}
</script>
</head>
<body>
<div class="background">
<div class="nav">
<a class="navCns">CNS</a>
<a class="navSignIn">로그인</a>
<a class="navSignUp">회원가입</a>
</div>
<div class="main">
<div class="mainHead">
<div class="mainHeadTitle1">Care aNd Service</div>
<div class="mainHeadTitle2">로그인</div>
</div>
<div class="mainBody">
<div class="mainBodyId">
<label for="Id" class="mainBodyLbl">아이디</label><br />
<input
type="text"
id="Id"
class="mainBodyInput"
placeholder="아이디를 입력해주세요." />
</div>
<div class="mainBodyPw">
<label for="Pw" class="mainBodyLbl">비밀번호</label><br />
<input
type="password"
id="Pw"
class="mainBodyInput"
placeholder="비밀번호를 입력해주세요." />
</div>
</div>
<div class="mainFoot">
<a class="mainFootBtn" onclick="Scccess()">로그인</a>
<a class="mainFootAccount">계정이 없으신가요?</a>
</div>
</div>
</div>
</body>
</html>
56 changes: 56 additions & 0 deletions 1310/CNS Project 2/Weather.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html,
body {
width: 100%;
height: 100%;
}
.background {
width: 100%;
height: 650px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.nav {
width: 100%;
height: 50px;
top: 0;
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
position: fixed;
display: flex;
flex-direction: row;
align-items: center;
}
.navCns {
width: 20%;
color: #1485ee;
text-align: center;
font-size: 25px;
font-weight: 700;
position: relative;
}
.main {
width: 800px;
height: 400px;
border: 1px solid #b2b2b2;
border-radius: 5px;
display: flex;
flex-direction: column;
}
#cityName {
font-size: 80px;
font-weight: 900;
color: #1485ee;
}
.mainBody {
height: 300px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
}
28 changes: 28 additions & 0 deletions 1310/CNS Project 2/Weather.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CNS Project 2</title>
<link rel="stylesheet" href="./Weather.css" />
<script src="./Weather.js"></script>
</head>
<body>
<div class="background">
<div class="nav">
<a class="navCns">CNS</a>
</div>
<div class="main">
<div class="mainHead">
<span id="cityName"></span>
<span id="weather"></span>
</div>
<div class="mainBody">
<p id="tempMin"></p>
<p id="tempMax"></p>
<p id="windSpeed"></p>
</div>
</div>
</div>
</body>
</html>
37 changes: 37 additions & 0 deletions 1310/CNS Project 2/Weather.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
const apiKey = "6cb08faa165808cef5f64335f15272fc";

fetch(
`http://api.openweathermap.org/geo/1.0/direct?q=Daegu&limit=5&appid=${apiKey}`
)
.then((res) => res.json())
.then((data) => {
let geo = data;

fetch(
`http://api.openweathermap.org/data/2.5/forecast?lat=${geo[0].lat}&lon=${geo[0].lon}&appid=${apiKey}`
)
.then((res) => res.json())
.then((data) => {
console.log(data);

// Value of object
const idWeather = document.getElementById("weather");
const idCityName = document.getElementById("cityName");
const idTempMin = document.getElementById("tempMin");
const idTempMax = document.getElementById("tempMax");
const idWindSpeed = document.getElementById("windSpeed");

idCityName.textContent =
JSON.stringify(data.city.name);
idWeather.textContent =
JSON.stringify(data.list[39].weather[0].main);
idTempMin.textContent =
"최저 온도 : " +
Math.round(JSON.stringify(data.list[39].main.temp_min) - 273.15);
idTempMax.textContent =
"최고 온도 : " +
Math.round(JSON.stringify(data.list[39].main.temp_max) - 273.15);
idWindSpeed.textContent =
"풍속 : " + JSON.stringify(data.list[39].wind.speed);
});
});
2 changes: 1 addition & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
![Group 3](https://github.com/2023NewCNSMember/Frontend-Assignment/assets/101560583/87ca165b-df46-4003-9912-417cbf8dba9b)
3. 클론이 되었으면 자신의 branch를 선택한뒤 vsc를 열고 자신의 학번으로 폴더를 새로 열고 개발을 하시면 됩니다.<br/>
![newcns3](https://github.com/2023NewCNSMember/Frontend-Assignment/assets/101560583/7b93c510-d7cd-4d99-aef6-51cfeb029295)
![newcns3-1](https://github.com/2023NewCNSMember/Frontend-Assignment/assets/101560583/07df326c-5afb-4538-a38f-62ad905854b8)
![newcns333](https://github.com/2023NewCNSMember/Frontend-Assignment/assets/101560583/a75b3a2f-0651-467b-9aa1-8e05ee20e4d4)

4. 만약 개발이 다 된 상태라면 create pull request를 눌러 자신의 학번이름으로 제목을 입력한뒤<br/>
내용엔 간단한 코드 설명을 적으시면 됩니다.(미리보기 사진이 있으면 더 좋습니다.)<br/>
Expand Down