안녕하세요, 선배님.

24년전 제가 고민했던 것을 똑같이 하시네요. 엄청 빠르십니다^^그 때 고민하다가 클라이언트로 특히, 웹으로 방향을 잡았으며 이후에는 웹 관련 기술 중심으로 개발을 했습니다. 결정하게 된 가장 큰 요인은, 웹 기술은 모두 표준이라는 것입니다. 즉, 바뀌지 않으므로 열심히 하면 기술이 축적된다는 생각이었습니다.사실, 웹 기술을 깊게 들어가면 서버보다 할 것도 많고 더 어렵습니다.서버는 머신이 대상이므로 나만 잘하면 됩니다. 머신은, 데이터베이스는 말이 없습니다.^^반면, 웹은 사람이 대상이므로 최종 판단은 내가 아니라 사용자가 한다는 것입니다. 100명을 모두 만족시키는 것은 불가능합니다.한편, 오래전부터 다른 생각이 들어 준비하고 있었습니다. 이에 대해서는 지금 말할 수 없으며 6개월 정도 후에 보여 드리겠습니다.그 때 보면 아시겠지만 우선 결론을 말씀드리면, 서버 또는 클라이언트 어느 한 쪽의 감을 잡는 것은 매우 큰 경험이며 자산입니다. 버리시면 안됩니다. 즉, 두 가지를 모두 하세요. 어려운 행보이지만 멀리 본다면 가야할 길입니다.어려운 부탁 아닌 부탁이지만, 기본에 충실하세요. 바닥을 파고 드세요. 매우 어렵지만 프로로 가는 바탕입니다. 새로운 기술을 짧은 시간에 내 것으로 만들 수 있습니다.프로는 아름답지만, 이면에는 나름 엄청나게 노력합니다.

CSSOM 강좌는 언제 올라오나요?

안녕하세요^^CSSOM 1차 원고까지 작성했습니다만 홀딩하고, 현재는 다른 강좌를 녹음하고 있습니다."클린업 자바스크립트"의 두 번째 강좌입니다.2025년 1월 중순에 오픈될 것 같습니다. 이어서 CSSOM이 아닌 다른 강좌를 만들려고 합니다.그래서 CSSOM 강좌 오픈은 당분간 어려울 것 같습니다.관심 가져 주셔서 감사합니다.새해 복 많이 받으세요^^

이 강좌를 들으면 좋은점이 뭔가요?

근본과 목적을 파고 들어가는 모습에 박수를 보냅니다. 지금보다 멀리 바라보고 접근하는 마인드가 너무 좋습니다.Q: 이 강의를 들으면 듣지 않은 사람들에 비해 어떤 경쟁력을 갖게 되는지 궁금합니다.A: 프로그램 개발 경험이 쌓이면 감각으로 프로그램을 개발하게 됩니다. 음악가, 미술가는 자신의 컬러를 갖고 있습니다. 소프트웨어 프로(레전드) 개발자도 마찬가지로 자신의 컬러를 갖고 있습니다. 컬러를 다르게 표현하면 자신의 감각을 더 깊게 완성시킨 것이라고 볼 수 있습니다.본 강좌는 사용자 인터렉션 감각 향상에 촛점을 두고 있습니다. 즉, 사용자의 액션을 유도하는 것과 사용자 액션에 따른 시스템이 처리하는 감각을 만드는 것입니다. 강좌에서 하나의 기능을 다루지 않고 기능과 관련된 시나리오를 다루는 것은 감각을 만드는 것에 중점을 두기 때문입니다.스펙의 모든 기능을 다루는 것 또한, 전체를 통해 감각을 만들기 위한 것입니다. 일부 기능을 선별하여 강의를 만드는 것은 그다지 어렵지 않습니다. 하지만, 100%에 가깝게 만드는 것은 정말 어렵고 시간도 많이 걸립니다. 그런데 부분만 발췌하면, 전체를 보는 감각을 만들어야 한다는 것에 어긋나며, 이것이 DOM이라고 하는 것은 강의자의 어설픈 주관이 될 수 있습니다. 이러한 레시피가 있습니다, 여러가지 맛을 보고 맛에 대한 감각을 만들 수 있도록 레시피를 제공하는 것이 강의자의 역할이라고 생각합니다. 수강자에게 감각을 만드는 다양한 맛을 제공하는 것입니다. 노하우는 본인 기준이지, 그것이 필요하지 않는 사람에게는 의미가 없습니다. 필요는 사람에 따라 다르며 선택은 필요한 사람이 합니다. 선택을 위한 레시피를 제공하는 것이 강의자의 역할이라고 생각합니다.Q: 리액트 심화 강의도 혹시 출시 하실 생각이 있으신지 궁금합니다.A: 생각은 하고 있습니다만, 지금은 최근에 오픈한 "클린업 JavaScript: 베이스 빌드업"의 후속 강좌인 "클린업 JavaScript: 점프업(가칭)" 강좌를 만들고 있습니다.지금과 같은 마인드로 접근하는 것은 매우 좋은 선택입니다. 어쩌면 지금은 조금 늦는다고 느낄 수도 있지만, 몇 년 안에 차이가 벌어지게 됩니다. 자바스크립트와 DOM 기본이 튼튼하면, 관련된 라이브러리(프레임워크)를 2~3주면 배울 수 있습니다. 왜냐하면, React와 Vue의 바탕은 자바스크립트와 DOM이기 떄문입니다. 두 개의 기술을 활용하여 개발자가 쉽게 코딩할 수 있도록 만든 것입니다. React의 useState() 개요를 파악하면 안에서 어떻게 처리하는지 예측할 수 있게 됩니다. 설령 예측을 못하더라도 자신감을 갖게 됩니다. 이것은 차이가 매우 큽니다

섹션 1. 6번째 강의 질문입니다.

Java 문법이 확장되었나 봅니다. 설명 요지가 자바스크립트는 int, double(정수 실수)를 구분하지 않는다는 것이므로 이 관점에서 이해하면 되겠습니다.

선생님 Objcet 질문 있습니다.

네이티브 오브젝트가 대문자Object, 호스트 오브젝트가 소문자 object인 것으로 이해 하였고 Global 오브젝트는 네이티브 오브젝트에 포함되어 있다고 이해 하였습니다.==> 강좌에서 대문자 Object는 {key: value} 형태의 Object를 뜻합니다. Object를 객체로 번역하는데, 엄밀하게 보면 번역하면 안되는 것입니다. 왜냐하면 자바스크립트에서 Object는 오브젝트 이름이기 때문입니다. 즉, 고유명사입니다. 강좌에서 소문자 object는 new 연산자로 생성한 인스턴스를 뜻합니다. 따라서 대문자와 소문자 object는 형태도 다르고, 만드는 방법도 다릅니다. 그래서 대문자와 소문자를 구분한 것입니다.자바스크립트에 네이티브라는 용어가 없습니다. 글의 문맥으로 보아 네이티브가 자바스크립트를 지칭하는 것으로 보아집니다만, 그냥 자바스크립트 오브젝트라고 하면 되겠습니다.호스트 오브젝트 용어 또한 없습니다. 호스트 환경(Environment)은 있으며, 중고급 과정에서 다룹니다.Global 오브젝트에서 Global은 자바스크립트에서 오브젝트 이름입니다. 다만 Global 오브젝트라는 실체가 없으며 Global 오브젝트의 프로퍼티와 함수가 Window 오브젝트에 설정됩니다.-------------섹션11 강의인 Global 오브젝트의 프로퍼티들은 전역 범위의 프로퍼티이고 호스트 오브젝트에 소문자 Global objcet(window)도 전역 범위에 항상 존재하는데 Global 오브젝트의 프로퍼티들이 소문자 Global objcet(window)에서 사용된다고 봐야할까요? 아니면 네이티브 오브젝트의 전역 범위에서 Global 오브젝트의 프로퍼티들이 사용되는 것 일까요?==> Global 오브젝트의 프로퍼티, 함수가 Window 오브젝트에 설정되므로 전역 범위라고 볼 수 있습니다. 한편, Global과 전역은 뉘앙스가 다릅니다. Global은 자바스크립트에서 오브젝트 이름입니다. 다만, Global 오브젝트의 프로퍼티, 함수가 Window 오브젝트에 설정되므로 전역 개념으로 사용할 수 있는 것입니다.답변을 완전하게 이해하지 못해도 됩니다. 지금은 이 정도로 정리하고 진도를 나가도 됩니다. 왜냐하면 자바스크립트 전체 감을 잡게 되면 이해의 깊이가 달라지기 때문입니다. 그 때, 전체적인 관점에서 깊게 생각해도 되겠습니다.

다이어그램 사용여부에 관하여 질문합니다.

좋은 질문입니다.1. 다이어그램을 작성하면 좋습니다.그런데, 문제는 시간이 걸린다는 것입니다.아직 요구사항이 확정되지 않았으므로 요구 사항을 정의한 것이 계속 바뀐다는 것입니다.그러면 문서도 정리하고 다이어그램을 정리해야 하는데, 시간이 걸립니다.문서를 보고 개발할 수 있도록 문서를 작성하므로, 다이어그램은 보조 역할을 하는 점도 있습니다.그렇다고 다이어그램을 기준으로 프로그램을 개발하는 것은 부족함이 있습니다.요구분석을 처음 공부할 때는 공부 차원에서 다양한 다이어그램을 작성하는 것은 괜찮습니다. 이를 통해 경험을 만들수 있기 때문입니다. 프로젝트에 따라 다이어그램 작성을 요구하기도 합니다.그런데 요구사항을 문서로 정리한 후, 문서를 보고 다이어그램을 만드는 경우도 있습니다. 그야말로 문서를 위한 문서 작성이지만, 어쩔 수 없는 경우도 있습니다.프로젝트 초반에 전체 구상을 위해 activity 다이어그램을 작성하기도 합니다. 서버 환경이 객체 지향 환경일 때는 Class 다이어그램을 작성합니다.

요구사항 상태 구분에 대해 질문합니다.

좋은 질문, 너무 좋습니다^^ 강의자의 생각을 적어봅니다.1. 요구사항과 현행 비즈니스 프로세스를 비교한 상태입니다.2. 상태 2에서 상태 1로, 상태 3이 상태 4로 이어지는 상황이 아닙니다.3. 상태 2는, 현행 비즈니스 프로세스가 요구사항을 포함하고 있다는 상태입니다.4. 현행 비즈니스 시나리오에 10개의 비즈니스 프로세스가 있다고 할 때, 이 중에서 비즈니스 프로세스 2개가 요구사항이라면, 요구사항을 포함하고 있는 상태입니다.나머지 8개 비즈니스 프로세스 중에서 포함, 변경, 제외, 추가가 발생할 수 있습니다.지금 단계는 비즈니스 목표 모델을 정의하기 위한 요구사항 조사 단계입니다.

forEach문을 활용한 코딩시간 풀이

코드는 고칠 것이 없네요. 코드를 작성한 후에 주석을 작성한 것은 아닌가요? 코드 위에, 앞에 주석을 작성하세요. 주석을 먼저 작성하는 것은 코드를 작성하기 전에 내 생각을 먼저 정리하는 것을 뜻합니다. 그리고 정리한 주석을 보고 코드를 작성하는 것입니다. 어렵지만 습관으로 만들기 바랍니다.수업을 듣고 있는데도 아직까지 혼자 명확하게 코드 짜는게 어렵고 많이 헤매네요ㅠㅠ언제쯤 문제사항을 보고 능숙하게 함수와 메소드를 활용해서 코드를 짤 수 있을까요 응용실력이 얼른 늘었으면 합니다...==> 당연합니다. 그래도 지금처럼 계속 꾸준하게 하면 됩니다. 힘들더라도 진도를 뛰어 넘으면 안됩니다. 자바스크립트 4개 강좌를 5번 반복하면서 매번 코딩한다고 생각하고 진행하기 바랍니다.프로그램은 감을 잡는 것이 중요합니다. 지금은 자바스크립트 프로그램의 언어적 감각을 만드는 단계입니다. 감을 잡으려면 전체를 보아야 하고, 생각한 것을 주석으로 작성하고, 검토하고, 그것을 코딩하는 방법이 왕도입니다. 반복할 때마다 감을 잡는 범위가 넓어질 것 입니다.

sort 코딩 시간 풀이

two - one가 양수인 경우는==> two - one이 음수인 경우debugger로 한 줄씩 코드를 따라 가면서 값이 변하는 상태를 브라우저 개발자 도구에서 보면 확실하게 이해할 수 있습니다. 이렇게 하는 것도 습관으로 만들어 보세요.내가 작성한 코드를 내가 완전하게 체크하는 마인드를 갖는 것은 매우 중요합니다.그러면 내 자신을 내가 믿게 됩니다.

코딩 시간 풀이 올려봅니다.

var list = []; //html에 들어갈 배열 자리 생성==> 주석을 코드 위에 작성합니다.//html에 들어갈 배열 자리 생성var list = [];주석을 작성하는 것을 알았으니 이제 주석의 질을 생각해야 할 때입니다.코드 설명은 코드를 보면 알 수 있으므로 목적, 의도를 작성하면 더 좋을 것 같습니다.push()는 배열 끝에 첨부합니다. 삽입은 중간에 끼워넣는 뉘앙스가 담겨 있습니다.대체적으로 좋습니다. 이렇게 계속 해나가면 좋은 결과를 얻을 것 같습니다. 응원합니다.