js6 v-if와 v-for 이번 단원에서는 Vue에서 if와 for를 사용하는 방법에 대해 배웠다. 일단 문법은 다른 언어들과 같아서 익숙했지만, html 코드 내에 작성하는게 뭔가 맘에 안든다. 나는 보통 html에서 태그 속에 뭐 넣는 걸 안좋아하는데 익숙해지면 괜찮아질 것 같기도 하다. 암튼 뭐 되게 간결하고 사용법도 쉽고, Js에서 코드 길게 안짜도 편리하다는 점은 정말 유용하다. v-if뷰에서 사용하는 if 문이다. html 태그 내에서 사용하며, 큰따옴표 안에 Js 코드를 작성한다. 아래는 goals라는 배열이 비어있다면 해당 텍스트를 나타내는 코드이다. 목표가 설정되지 않았습니다. 목표를 설정해주세요. v-else뷰에서 사용하는 else이다. if 바로 아래에서 사용해야 하며, 중간에 다른 태그가 들어가면 실행되지않는.. 2024. 6. 15. computed와 watch 이전 단원에서는 data와 methods 의 대해 배웠다. 이번 단원에는 Vue의 다른 개념인 computed와 watch에 대해 공부했다. 쉽게 설명하자면 computed는 연산형 데이터? 라고 말 할 수 있을 것 같고 watch는 데이터가 바뀔 때 알 수 있으니 디버깅할 때 좋을 것 같다. computed는 데이터에 직접 연산을 넣으면 가독성이 떨어지고, 효율이 낮아질 수 있으니 따로 분리하는 것이라고 이해했고, watch는 그냥 디버깅 하위호환이라고 이해했다. computed (연산 프로퍼티): 연산 작업이 필요한 변수를 데이터처럼 관리하기 위함. ➡️ 즉, 재사용성의 증가, 코드의 가독성 및 유지보수 작업이 향상된다. 메서드와 다른 점: 다른 데이터에 의존하는 데이터에 주로 사용. 해당 속성.. 2024. 6. 15. 포켓몬 MBTI Test 만들기 요즘 과제에 치이고 알바도 하느라 블로그를 안쓴지 오래된 것 같은데 나름 짬짬히 이것저것 만들긴 했다. 한 번에 포스팅하려니 막막해서 그중 하나인 mbti 테스트 먼저 포스팅 하려한다. + 아직 디자인은 완성되지 않았는데 포켓몬 세상을 컨셉으로 잡았다 ㅋ mbti 테스트의 기본 알고리즘은 E와 I, N과 S 등 4가지 클래스의 성향을 판단하기 위해 질문이 필요하다. 따라서 각 클래스의 질문은 홀수여야 하고, 어떤 성향이 더 큰지 비교하여 출력한다. 완성 사이트 starlit-frangollo-737871.netlify.app 이렇게 된다면 결과는 각각 2번씩 선택된 ESTP가 출력된다. 여기서 또 문제가 생겼는데 질문을 어떻게 해야할지 문제였다. 그런데 GPT한테 간단히 설명하고 질문지를 만들어달라고 요.. 2023. 5. 12. JavaScript를 이용하여 동적 테이블 만들기 (1) 오늘은 데이터베이스, 서버 없이 그냥 웹 상에만 존재하는 테이블을 만들어 보았다. 아직 서버와 데이터베이스 공부를 하지 않아 구축을 못했었는데 테이블을 만드는 과정에서 데이터베이스와 서버가 어떻게 움직이는지 조금은 알 수 있었다. 사실 원하는 행을 선택해 그 행만 삭제하는 기능을 넣고 싶었는데 insertRow()로 만들어진 행에 클래스를 주는 법을 모르겠어서 구현하지 못했다. 그런데 ChatGPT를 이용해 그 기능을 넣는 방법을 배웠고 조만간 응용해서 코드를 다시 짜던지 추가를 하던지 완벽하게 구현할 생각이다. 아 그리고 창을 2개 만들어 부모창과 자식창의 데이터 교환을 배웠는데 개념을 응용하기가 생각보다 어려웠던 것 같다. 이 부분에서 생각보다 많은 시간이 걸렸었고, input 의 Date 타입에서 .. 2023. 2. 27. JavaScript 시작 들어가며 처음에는 책에 있는 자바스크립트를 공부하며 블로그를 업로드 하려 했는데 기초적인 프로그래밍 방법밖에 나오지 않아 파이썬 카테고리에 있는 글과 너무 많이 겹쳤다. 그래서 자바스크립트 카테고리에 있는 글은 내가 스스로 써보려고 하며 주로 실습을 위주로 코드를 업로드 할 예정이다. 물론 책으로 얻는 이론도 충분히 중요하다고 생각하지만, 최근 블로그에 업로드 한 태양계와 친구가 만든 게시판의 프론트를 건드려보며 경험으로 얻는 지식이 정말 중요하다고 느꼈다. 언젠가 내가 구글에 다 오픈소스로 있는데 뭐하러 힘들게 다 직접 하지? 라는 생각을 한 적 있었다. 그런데 직접 하지 않으면 그 코드가 어떻게 작동하는지 잊는 경우가 태반이고, 같은 알고리즘이라도 결과의 형태가 바뀌면 쉽게 인지하지 못하는 경우도 많.. 2023. 1. 4. Doit HTML + CSS + JavaScript 출처 Doit HTML + CSS + JavaScript 카테고리에 있는 모든 글은 고경희 교수님의 'Doit HTML + CSS + JavaScript' (이지스 퍼블리싱) 에서 정리 및 요약 간접 인용한 것임을 밝힙니다. 2022. 8. 11. 이전 1 다음
