[항해플러스][WIL] Week 1. 프론트엔드 1주차 개발자입니다..

Weekly I Learned && What I Learned

 

1. 문제 (과제, 프로젝트를 진행하며 부딪힌 기술적 문제)

이번 주차에 겪은 문제는?

 

1주차 과제는 프레임워크 없이 SPA 만들기였다. VanillaJS로만 작업했는데, 기본적인 자바스크립트와 리액트 지식이 부족해 설정부터 어려웠다. 일단 HTML 템플릿을 기반으로 화면 렌더링은 했으나, 재사용 가능한 컴포넌트로 리팩토링하는 부분에서 큰 어려움을 겪었다.

 

프론트엔드 3년차라고 말할 수 있을까?

 

이전에 내가 설계한 컴포넌트는 그저 화면을 그리는 데 불과했다. 성능 최적화나 이벤트 처리 등 제대로 해본 적이 없었고, 리액트 훅에만 의존한 코드였음을 깨달았다.

2. 시도와 해결

문제 해결을 위해 어떤 시도를 했는가?

 

다행히 먼저 PR을 올린 분들의 구조 및 코드를 참고할 수 있었다. 레이아웃과 클래스 컴포넌트 설계는 큰 도움이 되었고, 다른 분들의 코드를 통해 렌더링, 이벤트 추가, 재렌더링을 쉽게 이해했다. 3기 여러분 정말 감사합니다🫶 저도 점차 성장해서 나중에 도움이 되었으면 좋겠어요.

3. 알게 된 것

문제 해결 과정에서 새롭게 알게 된 점은?

 

자바스크립트 기본 지식이 부족함을 절실히 느꼈다. 특히 클래스 동작 원리를 잘 몰랐고, Java와 비슷하리라 생각했지만 차이가 있었다.

Java 클래스 vs JavaScript 클래스

공통점:

• 둘 다 객체 지향 프로그래밍의 개념을 사용하며, 클래스 기반으로 객체를 생성하고 상속을 처리할 수 있다.
• 생성자 함수로 객체를 초기화하고, 메서드를 클래스 내부에 정의할 수 있다.

차이점:

• Java는 정적 타입 언어로 클래스의 구조가 컴파일 시 결정되며 엄격한 타입 검사를 거친다. 반면, JavaScript는 동적 타입 언어로 실행 중에 객체에 속성을 추가하거나 제거할 수 있어 유연성이 크다.
• Java는 클래스 상속이 기본적으로 extends 키워드를 통해 이루어지며, 다중 상속은 인터페이스를 통해 처리한다. JavaScript는 프로토타입 상속을 기반으로 상속 구조를 구현하고, 다중 상속을 직접 지원하지 않는다.
• JavaScript의 클래스는 ES6부터 도입된 문법적 설탕(Syntax Sugar)일 뿐, 내부적으로는 프로토타입 기반으로 동작한다는 점에서 Java의 전통적인 클래스와는 동작 원리가 다르다.

---

Keep : 현재 만족하며 유지할 부분

이번 주에 만족한 점은?

 

처음으로 PR 리뷰를 시도한 것. GitHub 사용 경험이 부족해 부끄럽지만, 잔디가 심어지는 것을 보고 의욕이 생겼다. 앞으로 더 적극적으로 리뷰를 요청하며 코드 품질을 높여야겠다.

 

Problem : 개선이 필요한 문제점

개선이 필요하다고 생각한 점은?

 

질문을 제대로 하지 못했다. 무엇부터 질문해야 할지 몰라 헤맸고, 오히려 과제를 끝낸 후에야 질문할 내용이 떠올랐다. 개발 일지 작성도 동시에 진행하기가 어려웠다.

 

Try : 문제 해결을 위해 시도할 것

다음 주에 시도할 것은?

 

팀원들에게 모르는 것은 바로 질문하고, 다른 팀과도 의견을 교류해야겠다. 더 이상 혼자 끙끙대지 말고 적극적으로 도움을 구할 예정이다.