자신에게 친절할 것 :)
728x90
반응형

Web Developing 39

[JS] background image 변경하기

// "Normad Coder의 초보자를 위한 바닐라 JS" 들으며, 모멘텀 클론 코딩 중// ​ 오늘 어제 투두 기능을 prac을 변수에 붙여서 똑같이 써보려고 했는 데 실패했다... 그리고 빠르게 다음 강의로 넘어가서 배경 이미지 변경으로 넘어갔는데 확실히 CSS를 잘 못 다루면 큰 의미가 없는 듯.. 배울 것이 너무 많다... 또, 국비지원 강의 이제 정해야 하는 데 이것도 생각보다 쉬운 게 아니다.. ​ 었쨌든 어제 하나하나 투두리스트 따라해서인지 오늘은 술술 넘어간 편이긴 하다. 이번에는 따로 순서대로 하나씩 확인하면서 하진 않았다. 확실하게 배운 것은 기능마다 js를 따로 빼줘야 된다는 사실이다. ​ body { background-color: #2c3e50; } body { color: wh..

Web Developing/JS 2024.03.16

[JS] to-do list 만들기

// "Normad Coder의 초보자를 위한 바닐라 JS" 들으며, 모멘텀 클론 코딩 중// ​ 처음에는 폼 만들기랑 비슷해서 괜찮을 줄 알았는데 생각보다 너무 복잡하다.. 정리하고 한 번 다시 만들어봐야 할 것 같아. ​ 오타 찾느라 시간 낭비도 많이 하고ㅠㅠ ​ to-do list라는 게 생각보다 기능이 많이 들어간다. 1. todo를 입력하고, 이걸 화면에 나타나게 하고(리스트로), 지우기 버튼도 만들고, 정보를 LS에 저장해야 함. 2. 버튼을 누르면 지워지게 하는데, 각각 화면과 LS 모두에서 지우고 저장되어야 함. ​ 이번에는 따라 하면서, 순서를 확인하면서 해서 그 방법대로 정리해 볼 것. 그냥 무조건 냅다 클래스 만들고 시작할 것. 근데, html에 리스트를 만들어 내는 게 아니라 입력하..

Web Developing/JS 2024.03.16

[JS] form 만들고 저장하기 (사용자 이름 기억하게 하기)

// "Normad Coder의 초보자를 위한 바닐라 JS" 들으며, 모멘텀 클론 코딩 중// ​ 기능 하나를 구현해 내는 데는 생각보다 손이 많이 간다. 코딩은 문제를 해결하는 방법을 배운다는 말이 이해가 간다. ​ 연구할 때 주제를 선정하고, 해당 분석 방법을 고르고, 적용하고 해석했던 것처럼 폼을 만드는 것도 보이게 하고, 입력이 가능하게 하고, 그것을 저장하게 하고, 어떤 언어를 사용해서 어떻게 보이게 할지(인사말)도 정해야 한다. ​ 확실한 것은 내가 무엇을 원하는지를 명확하게 알아야 한다는 사실이다. 이번 강의에서 처음 써 보는 태그인데 말 그대로 폼, 입력 양식을 의미한다. 로그인 창, 회원가입 폼이 해당되기에 앞으로 많이 사용할 것 같다. ​ 은 전체 양식으로 화면에 나타나지 않기에, 실제..

Web Developing/JS 2024.03.16

[JS] 시계 만들기

// "Normad Coder의 초보자를 위한 바닐라 JS" 들으며, 모멘텀 클론 코딩 중// ​ ​ 시계를 만드는 방법은 수십 가지이고(어쩌면 수백일지도), 개인마다 다르게 코드를 짠다. ​ 강의를 바탕으로, 매초 변화하는 "00:00:00"형태를 만들었다. (이미 10 미만은 앞에 0이 붙도록) 아무래도 읽기 편하려면 1. "13시"보다는 "1시"가 직관적이기에 12가 넘어가면 자연스럽게 "01"로 바뀌는 것, 2. a.m.과 p.m. 을 넣는 것을 어떻게 구현할지 고민했다. ​ new Date() 가 어떤 함수인지는 아직 모르겠지만, 뭐.. 돌아가면 된 거니까. ​ 외워서 바로 짜지는 못하더라도, 찾아서 응용하는 것이 코딩에 핵심이기에 이 정도로 만족한다. ​ 이전 강의에서 ``(백 틱)으로 str..

Web Developing/JS 2024.03.16

[JS] classList를 써서 methods를 활용, 특히 toggle

// "Normad Coder의 초보자를 위한 바닐라 JS" 들으며, 모멘텀 클론 코딩 중// ​ 하나의 content에 여러 개의 기능들(예, 클릭 시 글자 색 변경, 컨텐츠 위에 마우스 커서 유지 등)을 따로 className을 부여하여 할당하면 어떤 것은 자동으로 뒤로(원래의 상태로) 돌아가지 않는다. ​ 따라서 classList를 사용하여 객체에 포함된 함수인 methods를 활용한다. add(), remove()가 자주 사용된다. 이때, 상태를 일일이 if (className === )로 부여하지 않아도 된다. 클래스를 답은 변수(hasClass)를 하나 만들고, 클릭해서 색이 변경되면 할당된 변수인 "CLICKED_CLASS"를 사라지게 하고, 사라지면 다시 추가되게 하는 함수 인 것이다. c..

Web Developing/JS 2024.03.16

[JS] JS or CSS가 웹페이지에 적용이 안 될 때

... 장작 이틀 동안 고생하면서, 왜 JS가 적용이 안 되는지 고민했다. ​ 강의도 중간부터 못 들으면서 말이다. ​ 덕분에 오랜만에, 문제를 해결해 보겠다고 다양한 시도를 했다. ​ 구글, 유튜브 검색, Normad Coder와 Stack Over Flow 커뮤니티에 글도 남기고, 다행히 SOF가 나를 살렸다. 살려지는 경험(?)은 언제나 쪽팔리면서도 즐겁달까. 묻고 답해주는 커뮤니티가 활성화 된 개발 분야로 넘어오길 잘 했다는 생각이 오늘도 든다. ​ (ps. 문제의 원인은 ^^ 오타.. oh gosh..) ​ 기술 블로그의 첫 글은, 또 이 방법을 잊을 미래의 나와, 같은 문제를 겪을 다른 분들을 위해서 쓴다. ​ JS or CSS가 웹페이지에 적용이 안 될 때 ​ 1. 오타 확인 ​ 2. 캐시 ..

Web Developing/JS 2024.03.16

[Java] printf()의 지시자

// 남궁성의 자바의 정석 기초편 듣는 중// ​ 진수는.. 진짜 빨리 익숙해 져야 할 거 같애.. 어리버리 얼레벌레인데.. 너무 헷갈려.. 출력형식 지정을 위해서 printf() 선호 ​ 지시자의 개수 만큼 값을 써줘야 함. 개행문자로 줄 바꿈을 해주는 데 os 종류에 따라서 \n 이 안 먹힐 때도 있어서, %n을 쓸 것. ​ ​ 이진문자열 변환은 잘 사용x 출력 시, 접두사는 안 나오는 데 붙이고 싶으면 '%#접두사' 넣어 주기 실수는 주로 f인데 이건 정밀도가 7자리라서.. 그보다 아래 수는 정확하지 않고, 마지막 수는 대개 반올림. %e --> 지수 형식으로 e+02 = 10^2 간략한 형식 %g는 대개 f를 사용해서 7자리로 나타냄. 0으로 나타내는 게 더 편해 보이면 %e로 나타냄. 근데 사실..

Web Developing/Java 2024.03.15

[Java] 변수, 상수, 리터럴

// 남궁성의 자바의 정석 기초편 듣는 중// ​ 왜 처음에 자바부터 하지 말라는지.. 알겠음.. 너무 재미가 없어.. 결국.. js 강의도 동시에 .. 듣는 중.. println() 줄 바꿈 print() 줄바꿈 안함 fn + cmd + f11 실행 단축키 ​ ​ 상수는 값 변경X,final int 리터럴 literal 상수와 구별하려고 그 자체 값을 의미하는 것. ​ 접미사는 정수형 Long에 붙이는 L하고, 실수형 float에 붙이는 f만 신경 실수형은 2개 밖에 없어서 double의 d는 거의 뗌 접미사는 대소문자 구별 x 줄바꿈 문자 -> 개행 문자 '\n' --> 탭이나 백스페이스는 앞에 \ 붙여서 표현 초록색 --> f, d, ., e 가 있으면 실수형 리터럴임. 0이 생략되어있더라도 출력 ..

Web Developing/Java 2024.03.15

[Java] 단축키

// 남궁성의 자바의 정석 기초편 듣는 중// ​ ..... 옛날 강의고.. 맥에 대한 고려가 없기 때문에.. 이상하다 싶으면 꼭 댓글을 확인하시길 추천합니다... ​ 프로그램들이 많이 변경되어서,, 걍.. 댓글을 자주 보세요. cmd+shift+L 단축키전체 목록 cmd + d 한 줄 삭제 cmd + opt + shift down 행단위 복사 --> 충돌 시 불편하면, preference 없으면 cmd +, 눌러서 수정 할 것 멀티 컬럼 : opt + cmd + A 누르고 shift눌러서 아래로 누르기 opt + up, down 누르면 행단위 이동 cmd+i 들여쓰기 맞춰줌 shift + tab 내어쓰기 cmd +/ 주석(토글) 여러줄은 /* */ 자동 완성 : opt + space 예,sop 자동 완..

Web Developing/Java 2024.03.15
728x90
반응형