목록[실습]/[실습] 프론트엔드 (5)

나만의 개발노트

[JS프로젝트] 7. QnA 게시판 만들기

[나의 코드] - index.html ... general questions Do You Accept All Major Credit Cards? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est dolore illo dolores quia nemo doloribus quaerat, magni numquam repellat reprehenderit. ... *그림으로 보기 [더 나은 코드] - index.html -> sidebar 클래스를 div 가 아닌 aside로 사용함 - aside태그 : 별도 구획 요소 - 문서의 주요 내용과 간접적으로만 연관된 부분. 주로 사이드바 혹은 콜아웃 박스를 표현한다. 전체 코드 보기 https://githu..
[실습]/[실습] 프론트엔드 2023. 5. 17. 22:37
[JS프로젝트] 5. Sidebar 만들기

[나의 코드] - index.html ... ... ... ... ... ... [더 나은 코드] - index.html ... ... ... ... ... ... ... -> sidebar 클래스를 div 가 아닌 aside로 사용함 - aside태그 : 별도 구획 요소 - 문서의 주요 내용과 간접적으로만 연관된 부분. 주로 사이드바 혹은 콜아웃 박스를 표현한다. 전체 코드 보기 https://github.com/mokjakA/std_JS GitHub - mokjakA/std_JS Contribute to mokjakA/std_JS development by creating an account on GitHub. github.com 프로젝트 참고 https://www.freecodecamp.org/ne..
[실습]/[실습] 프론트엔드 2023. 5. 15. 16:27
[JS프로젝트] 4. Navbar 만들기

- html의 -> 화면 HTML 삽입 미리보기할 수 없는 소스 + a태그 내부에 i태그를 하면, 아이콘을 링크가 연결된 버튼처럼 사용할 수 있음
[실습]/[실습] 프론트엔드 2023. 5. 12. 23:26
[JS프로젝트] 2. 버튼으로 숫자 카운트

[나의 코드] - index.html counter 0 DECREASE RESET INCREASE - app.js const decBtn = document.getElementById('dec_btn'); const resBtn = document.getElementById('res_btn'); const incBtn = document.getElementById('inc_btn'); const value = document.getElementById('value'); let count = 0; decBtn.addEventListener('click',function(){ count--; if(count>0){ value.style.color = 'green'; }else if(count === 0){ ..
[실습]/[실습] 프론트엔드 2023. 5. 3. 22:39
[JS프로젝트] 1. 배경색상 랜덤하게 만들기 _ 230419(수)

[필요한 개념] arrayshttps://itnote-for-me.tistory.com/14 document.getElementById() https://itnote-for-me.tistory.com/15 document.querySelector() https://itnote-for-me.tistory.com/16 addEventListener() https://itnote-for-me.tistory.com/17 document.body.style.backgroundColor Math.floor() Math.random() array.length [참고] https://www.freecodecamp.org/news/javascript-projects-for-beginners/#how-to-create-a..
[실습]/[실습] 프론트엔드 2023. 4. 19. 23:49
이전 Prev 1 Next 다음