강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

개발자 취업 포기님의 프로필 이미지
개발자 취업 포기

작성한 질문수

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

12.13) New 페이지 구현하기 1. UI

영상 마지막에서 body 태그의 display: flex 설정을 안해도 문제가 발생되지 않는 이유

작성

·

23

·

수정됨

0

저는 코드를 똑같이 작성했는데 마지막에 Editor.css에

.Editor > section {
  margin-bottom: 40px;
}

를 추가해도 body 태그의 영역이 축소되는 이상 현상이 발생되지 않았습니다.

그냥 넘어가려고 하긴했는데 왜 동일한 코드인데 제 환경에서는 이상 현상이 발생되지 않는지가 궁금해서 질문드립니다.

 

다른분들은 강의처럼 body 태그 축소 현상이 발생되여 index.css의 body 태그에 display: flex 설정을 넣었을 때 왜 해결이 되는지에대한 질문은 많은데,

저처럼 아예 발생하지 않은 분들은 안계신 것 같더라구요..

 

브라우저는 크롬 쓰고 있고 현시점 최신 버전인 144.0.7559.110(공식 빌드) (arm64) 버전을 쓰고 있습니다.

답변 1

0

이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

안녕하세요 이정환입니다.

전체 코드를 파악해 봐야 확인이 가능할 것 같습니다. 강의 예제 코드와 달라진 부분이 정확히 어디에 있을지 현재로써는 파악할 정보가 부족한 것 같습니다 🥲

깃허브나 구글 드라이브에 전체 프로젝트를 업로드 하신 뒤 링크 형태로 전달해주시기 바랍니다.

 

PS. 이전에 아래와 같이 수강평을 남겨주셨었는데요 해당 수강평에 답글을 달아드리려다가, 마침 질문 주셨길래 여기에 대신하겠습니다.

(수강평에 답글을 달게 되면 많은 분들이 공개적으로 보시게 되고, 혹시나 다른 수강생분들이 강하게 반응하시거나 논쟁이 생길 수 있을 것 같아서 최대한 자제하고 있습니다..)

image.png

우선 모든 수강평은 바로바로 보고 있습니다. 낮은 별점을 받을 경우 판매에 영향이 많이 가기도 하다보니 🥲 당연히 작성해주시는 즉시 이메일로 바로 알림을 받아보고 있습니다.

강의를 열심히 들으시면서 힘드셨던 점에 대해 충분히 공감하고 이해합니다. 하나하나 기록하며 학습하시는 분들에게는 분명 불편하셨을 것 같네요.

 

제 강의를 앞으로 들어야 할 생각에 머리가 아플 정도 + 수강평 2점을 남겨주실 정도라면 많이 불만족 스러우셨을 것 같습니다 ㅠㅠ ... 환불을 원하신다면 플랫폼과 협의해 이후의 모든 강의를 다 환불해드리도록 하겠습니다. (플랫폼 정책상 환불 기간이 지났을터라 어려울 수 도 있을 것 같은데요 이 부분은 제가 직접 문의해 보겠습니다)

앞으로 원하지 않는 방식의 강의를 억지로 수강하시기 보다는 원하시는 자료로 학습하시는게 더 좋을 것 같아서 제안드리니 편하게 말씀 부탁드립니다.

 

다만 제가 강의를 이렇게 제작하게 된 이유는, 단순히 완성된 코드를 보여드리는 것보다 실제 개발 과정에서 겪는 시행착오를 함께 경험하는 것이 훨씬 더 중요하다고 생각했기 때문입니다.

실무에서 개발을 할 때 처음부터 완벽한 코드를 작성하는 경우는 거의 없습니다. 계속해서 문제를 발견하고, 코드를 수정하고, 더 나은 방향을 찾아가는 과정의 연속이죠. 저는 수강생분들이 이런 실제 개발 과정을 간접적으로나마 체험하시고, "왜 이렇게 코드를 작성해야 하는지", "왜 이 방법이 더 나은지"를 스스로 이해하실 수 있도록 의도적으로 이런 방식을 선택했습니다.특히 코드를 작성하다가 문제를 발견하고, 그 문제에 대한 해결책을 찾아가는 과정을 보여드리는 것이 중요하다고 생각했습니다.

"이 코드는 이런 문제가 있네요" → "그럼 이렇게 해결해봅시다" 라는 흐름을 통해 단순히 정답만 보는 것이 아니라, 문제 해결 능력 자체를 키우실 수 있도록 했습니다.

단순히 완성된 코드만 보여드리면 그 코드가 나오기까지의 고민과 판단 과정, 그리고 어떤 문제를 해결하기 위한 코드인지를 전달하기 어렵고, 결국 "따라만 하는" 학습이 될 수 있다고 생각했습니다.

물론 이런 방식이 모든 분들의 학습 스타일에 맞지 않을 수 있다는 것도 이해합니다. 말씀해주신 것 처럼 모든 예제를 다 기록하시면서 학습하시는 방향이라면 불편하셨을 수 있을 것 같아요 ㅠㅠ 변명아닌 변명으로 들어주시면 감사하겠습니다 ...

 

덧붙여 혹시나 한 가지만 조심스레 추천드리자면..! 강의를 보면서 모든 코드를 처음부터 끝까지 직접 타이핑하며 필기하는 것은 비효율적인 학습 방법일 수 있습니다.

제가 권장드리는 방법은 강의의 일부 파트를 먼저 쭉 보시면서 전체 흐름을 파악하시고, 핵심 개념과 "왜 이렇게 하는가"에 대한 답만 메모하시는 겁니다.

특히 강의 영상이 30분 정도씩 되다 보니, 한 번에 다 보시려고 하기보다는 10~15분 단위로 끊어서 보시는 것도 좋은 방법입니다. 예를 들어 "컴포넌트 구조 설계" 부분을 보셨으면 일시정지하고, 핵심만 메모하신 뒤, 다음 부분인 "상태 관리" 부분으로 넘어가는 식으로요. 이렇게 하시면 한 번에 모든 걸 받아들이려는 부담도 줄어들고, 학습 효율도 훨씬 좋아집니다.

절대로 모든 코드를 암기하듯 공부하실 필요는 없습니다! 저조차도 강의에 사용된 코드를 암기하고 있지는 않습니다. 그때그때 문제 상황에 맞는 코드를 찾아 떠올려 작성하는 편이죠.

중요한 건 "이런 문제는 이런 방식으로 해결할 수 있구나"라는 개념과 접근법을 이해하는 것이지, 코드 한 줄 한 줄을 외우는 게 아니니 권장드린 방식으로 학습해보시는 것도 추천드립니다.

수강에는 큰 문제가 없긴한데 이유가 궁금해서 일단 코드를 전달 드립니다.
https://drive.google.com/file/d/1c4gznWVH6IjJ1f-d4WCMv734Ew119AJW/view?usp=drive_link


수강평에 대한 상세한 답변 감사드립니다.

지금은 90%이상까지 들은 시점에서 수업 자료가 제공되는 강의에 비해 오래걸리긴 하지만 나름대로 작성하는 노하우가 생기기도 해서 말씀해주신 형태로 강의를 듣고 그 코드의 내용을 리뷰하면서 정리하는 형태로 진행하고 있긴합니다.

 

중간에 넘어가는 내용중에서 중요하다고 생각되는 부분은 메모를 해서 반영하기도 하구요.

 

어떠한 의미로 이렇게 강의를 제작을 해주셨는지는 이해가 되긴합니다.

강의만 보는 상황에서는 이해가 안되는 부분없이 잘 넘어가니까요,

그렇지만 이후에 제작되는 강의는 조금 더 이러한 부분을 고민해서 강의예제나, 강의 자료를 같이 공유해주시면 더 좋을 것 같습니다.

요즘 ai가 잘되어서 그냥 ai 한테 물어본다고 하지만 강의를 듣고 그 내용을 정리해서 ai의 문답 내용을 교차 검증하는건 큰 차이가 있다고 생각하거든요.

강의 내용이 많아서 적어두지않으면 까먹기도하고..

반영이 되면 이후에 강사님의 강의를 수강하시는 분들은 더 좋아하시지 않을까 생각됩니다.

 

정성스러운 피드백에 수강평은 다시 별점을 높게 드릴게요.

환불건은 진행해주지 않으셔도 괜찮습니다


이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

안녕하세요 공유해주신 코드 확인해보았습니다

우선 보내주신 코드에는 아무런 문제가 없었습니다...

왜 이런 문제가 발생했는지 살펴보니~ 강의 리뉴얼 과정에서 제가 index.css 파일 내에 #rootmin-height: 100vh를 설정하는 부분을 나중에 추가하게 되면서 꼬인 거였습니다.

min-height: 100vh를 넣으면 display: flex 없이도 전체 화면을 꽉 채우게 설정이 돼서 사실 display: flex가 없어도 되는 상황이었어요. 이 부분은 제가 강의에 수정해두도록 하겠습니다 혼란드려 죄송합니다 ㅠㅠ


다시 한번 소중한 피드백 남겨주셔서 정말 감사합니다. 강의 예제나 자료 공유에 대한 부분은 진심으로 귀담아 듣겠습니다. 앞으로 제작하는 강의에서는 이런 부분들을 더 고민해서, 수강생분들이 좀 더 편하게 학습하실 수 있도록 개선해보겠습니다.

(TMI 이지만 ... 사실 강의 교안 제작의 필요성을 크게 느끼고 있어서 최근 교안 제작과 편집을 담당해주실 소중한 직원분도 한분 모셨습니다 !_! )

개발자 취업 포기님의 프로필 이미지
개발자 취업 포기

작성한 질문수

질문하기