본문 바로가기
반응형

JavaScript157

메인 페이지 인덱스 꾸미기 메인 페이지 인덱스 꾸미기 제 공부 메인 페이지 입니다. https://dongjin6539.github.io/web2023/ 기존에 공부하기 전에 받았던 페이지를 자신의 것으로 수정해봤습니다!!! 기존 페이지 색상 바꾸기 먼저 해당 부분에 코드 구성이 어떻게 되어있는지 확인을 해봐야합니다. 그러기 위해서 오른쪽 마우스 버튼를 누르면 검사가 나옵니다. 그것을 클릭해봅니다. 단축키는 F12입니다. 나오면 위와 같은 순서대로 해봅니다. 1번처럼 해당 버튼을 클릭하면 화면의 부분을 클릭할 수 있습니다. 2번처럼 화면에 알고 싶은 부분을 클릭을 해봅니다. 그러면 해당 부분의 코드가 나오고 밑에 css가 어떻게 되어있는지 나옵니다. 3번처럼 해당 부분의 css를 확인하고 3번의 오른쪽 위에 부분을 보시면 해당 폴.. 2023. 5. 7.
[Github] 깃허브 메인 페이지 꾸미기! [Github] 깃허브 메인 페이지 꾸미기! 제 깃허브 메인 페이지 입니다. https://github.com/dongjin6539 본인 ID 레퍼지토리 생성하기 우선 깃허브 프로필을 설정하려면 본인의 ID와 일치하는 이름으로 레퍼지토리를 생성해야 한다. README.md 파일 생성하도록 체크하라는 내용이다. 바로 체크하고 레퍼지토리를 생성하자! 그럼 이 레퍼지토리의 README.md 파일이 내 깃허브 프로필에 출력되는 것을 확인할 수 있을 것이다. README.md 꾸미기 헤더 우선 헤더 부분은 'capsule-render'라는 오픈API를 사용하였다. 이곳에서 자신의 스타일대로 만들어 링크한 줄만 복사하면 사용할 수 있다. https://github.com/kyechan99/capsule-render.. 2023. 5. 6.
자바스크립트 게임 이펙트01 : 음악 효과(2) 자바스크립트 게임 이펙트01 : 음악 효과(2) 수업 시간에 배운 내용을 복습하면서 해보겠습니다. 반복(한곡 반복, 랜덤 반복, 전체 반복), 뮤직 리스트에 대한 자바스크립트를 추가했습니다. 코드 보기(HTML, JAVASCRIPT / CSS1 / CSS2 / MUSIC.CSS / JS) / 완성화면 반복(한곡 반복, 랜덤 반복, 전체 반복) JAVASCRIPT // 반복 버튼 클릭 musicRepeat.addEventListener("click", () => { let getAttr = musicRepeat.getAttribute("class"); switch(getAttr){ case "repeat" : musicRepeat.setAttribute("class", "repeat_one"); music.. 2023. 5. 5.
자바스크립트 콜백 지옥 해결 : GSAP 라이브러리 자바스크립트 콜백 지옥 해결 : GSAP 라이브러리 길라잡이 https://dongjin6539.tistory.com/101 콜백 함수 블로그에서 확인 할 수 있는 콜백 지옥을 해결하기 위해 GSAP 라이브러리를 사용해서 가성이 좋도록 해결할 수 있습니다. 콜백 함수를 해결하려는 이유는 콜백 함수를 중첩해서 사용하면서 코드가 복잡해지고 가독성이 떨어지는 현상을 말합니다. 비동기적으로 수행되는 작업이 많아지면서 콜백 함수가 중첩되어 사용되면서 코드가 복잡해지고, 디버깅이 어려워지고, 유지보수가 어려워지는 문제점이 발생하기 때문입니다. 예시 코드 구성 DJ's PORTFOLIO work about let's introduce frontend developer's all works of portfolio do.. 2023. 5. 4.
자바스크립트 함수 : 콜백(callback) 함수 자바스크립트 함수 : 콜백(callback) 함수 콜백(callback) 함수란? 콜백(Callback) 함수는 간단히 말하면 매개변수로 함수 객체를 전달해서 호출 함수 내에서 매개변수 함수를 실행하는 것을 말한다. 즉, 콜백 함수란 파라미터로 일반적인 변수나 값을 전달하는 것이 아닌 함수 자체를 전달하는 것을 말한다고 보면 된다. 또한 어차피 매개변수에 함수를 전달해 일회용으로 사용하기 때문에 굳이 함수의 이름을 명시할 필요가 없어 보통 콜백 함수 형태로 함수를 넘겨줄때 함수의 이름이 없는 '익명 함수' 형태로 넣어주게 된다. 콜백 함수는 비동기적인 상황에서 특히 유용합니다. 예를 들어, 서버에서 데이터를 가져와서 처리하는 경우, 서버로부터 데이터를 가져오는 데 시간이 걸리기 때문에 콜백 함수를 사용하.. 2023. 5. 3.
코딩 공부하기 일과(1) 코딩 공부하기 일과(1) 오늘은 첫 오전 수업은 개인 수업시간 내용 정리 사이트 일부를 정리했습니다. 화면 : https://dongjin6539.github.io/web2023/ 두번째로 위의 사이트에 있는 SITE1 / SITE 유형 완성의 페이지를 완성시켰습니다. https://dongjin6539.github.io/web2023/site/site1/index.html 코드는 기존에 홈페이지 만들기에서 사용했던 코드와 CSS를 가져왔습니다. 헤더 유형 : https://dongjin6539.tistory.com/44 슬라이드 유형 : https://dongjin6539.tistory.com/40 이미지 유형 : https://dongjin6539.tistory.com/28 이미지/텍스트 유형 : h.. 2023. 5. 2.
반응형

티스토리툴바