본문 바로가기

전체 글120

Clone_Coding. Google (Like_a_Google) https://likeagoogle.netlify.app/ 구글 클론 코딩을 해보았다. 레이아웃은 간단했다. 하지만 평소 css를 홀대했던 나는 크게 디였다.. 최근에 많은 것을 배웠다. 레이아웃은 그냥 잡는게 아니라 섹션별로 구분하는게 내가 보기에도 편하다는 것을. # HEADER Google 정보 스토어 Gamil 이미지 apps 기타 Google 앱 및 제품 로그인 지금와서 생각해보니 apps-dropdown에 들어가는 a 태그 들을 ul태그로 묶어서 했을걸 그랬나 싶네요. css부분은 필요한 부분만 작성하고 생략하겠습니다! (너무 길어..) .container-menu .right-menu .apps-menu .apps-dropdown { position: absolute; background-c.. 2023. 4. 8.
마크다운 작성 방법 👀 소위 말하는 타이틀 작성 요령 제목 = # 제목 제목 = ## 제목 제목 = ### 제목 쉽게 설명하면 h1, h2, h3의 순서대로 #이 붙을 수록 타이틀의 폰트 크기가 작아진다. 문장 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세 대게 문장은 "닳도록" 뒤에 엔터쳐서 줄 바꿈 하면 위에 처럼 표시가 되지않고, "동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라 만세" 이렇게 이어서 표시가 된다. (근데 티스토리는 안그런가봄..) (네이버 국어 사전) > 인용문 >> 인용문 >>> 인용문 >>> 인용문 >>> 인용문 (티스토리는 위 방식으로 인용문을 작성하면 밑에 처럼 나온다.) 인용문 (READEME에서는 아래와 같이 나온다.) 인라인 코드 강조 css에서 backgro.. 2023. 4. 7.
만들어 본 거 잡동사니 배포 https://d-day-calculator.netlify.app 첫 작품 디데이 계산기 https://simples-note.netlify.app 메모장 https://codingbear-lotto.netlify.app 로또 추첨 https://weather-bear.netlify.app 현재 날씨 예보 https://forecast-bear.netlify.app 단기 일기 예보 2023. 4. 4.
Javascript 문법. switch 열의가 식은건 아닌데 블로그에 정리하는 횟수가 적어졌달까.. 패스트캠퍼스 프론트엔드 부트캠프 2주차에 접어들었습니다. switch 조건문에는 if문 이외에 switch문이 있습니다. if문과 swich문은 조건을 충족할 때 실행됩니다. switch문은 하나 이상의 case문으로 구성됩니다. 대개 default문도 있지만, 이는 필수는 아닙니다. *참고자료 : MDN Web Docs - switch switch(조건) { case value1: // value1이 실행 될 때 문장 // ex. value1은 1이다. 맞으면 value1에서 종료, 아니면 value2로 넘어감 break; case value2: //value2가 실행 될 때 문장 break; . . . case valueN: // break.. 2023. 3. 30.
JavaScript 문법. do while(ver. 수정1) 각설이 죽지도 않고 돌아왔습니다. do...while 테스트 조건이 거짓으로 평가될 때까지 지정된 구문을 실행하는 루프를 만듭니다. 단, 구문이 실행된 뒤에 테스트 조건이 평가됨으로 구문은 무조건 한 번은 실행됩니다. *참고자료 : MDN Web Docs - do while 일단, 설명만 봐서는 while문이랑 크게 차이는 보이지 않는거 같다. 다만 실행순서가 조금 다른데 do{ //구문 } while (//조건식); 구문 테스트 조건이 참일 때마다 한 번이상 실행되는 구문입니다. 만약 루프 내에서 여러 구문을 반복 실행 시키고 싶으시다면, 다음 명령을 사용합니다. block 구문을 활용하여 ({ ... }) 이런 식으로 그룹화합니다. 조건식 루프가 실행될 때마다 평가되는 식입니다. 만약 조건식이 참으로.. 2023. 3. 20.
어후..갑자기 기상api에 꽂혀서 기상 api에 꽂혀서 이런 저런 api찾다가 결국 돌고 돌아 openweather api를 이용해서 뻘짓을 좀 했습니다.. 처음엔 그냥 현재 날씨웹앱을 만들었고, 두번째는 단기 예보 웹앱을 만들었습니다. https://weather-bear.netlify.app/ Document weather-bear.netlify.app 현재 날씨 웹앱이고, 이걸 바탕으로 만든게 https://forecast-bear.netlify.app/ OpenWeather Forecast forecast-bear.netlify.app 3시간 마다 변경되는 5일 짜리 단기 예보 웹앱입니다. 해외 날씨 api를 써서 그런지 기상청에서 보는거랑 조금 안맞는거 같긴한데 json파일 열어서 보면 맞게 잘 동작하는거 같습니다. 이런저런 하.. 2023. 3. 15.
JavaScript 문법. while loop 오늘은 while loop문에 대해 알아보겠습니다. while이란, 조건문이 참일 때 실행되는 반복문이다. 조건은 문장안이 실행되기 전에 참, 거짓을 판단한다. *참고자료 : MDN Web Docs - while while (condition) statement condition(조건) 반복이 시작되기 전에 조건문은 참,거짓을 판단받게 된다. 만약 조건문이 참이라면, while문 안의 문장들이 실행된다. 거짓이라면, 문장은 그냥 while 반복문 후로 넘어간다. statement(문장) 조건문이 참일 때만 while문 속의 문장들이 실행된다. 반복문 속에 여러개의 문장을 사용하고 싶다면 중괄호 { } 를 통해 문장들을 하나로 묶어야 한다. 예시 문장, let hamburger = 8; while (ham.. 2023. 3. 2.
Vanilla JS. 로또 추첨기(while) + 추가ver. for 하라는 공부는 안하고 로또 추첨기를 만들고 있는 내가 레전드 먼저, 버튼을 눌러서 번호가 출력되게 html파일에 기본적인 기능만 세팅을 해줍니다. START 그 다음에 app.js파일에 const start = document.querySelector("#start"); const result = document.querySelector("#result"); start.addEventListener("click", startLotto); start와 result를 불러와서 변수로 설정 한 후에 click 이벤트를 수신하고 startLotto 함수를 트리거하는 start에 이벤트 리스너를 추가합니다. function startLotto() { const lottoNumbers = []; }; startLo.. 2023. 3. 1.

티스토리툴바