소개
파이썬과 장고에 진심인 소프트웨어 개발자
- 파이썬 사랑방 주인장
- 파이썬 사랑방 with Django/React 커뮤니티 (구. Ask Django) 운영자
- Microsoft Azure MVP 어워드 수상 (2016년~2021년)
여러분의 파이썬/장고/리액트 페이스메이커가 되겠습니다. 😉
강의
전체5수강평
- 빨리 완강해주세요
dev
2024.03.23
0
- 엄청납니다.
큐 브
2024.03.03
1
- 강의 자체를 잘 못함
병맛과학
2024.03.01
1
- 좋은 강의 감사합니다.
문석청
2024.02.22
1
게시글
질문&답변
2024.04.28
04-04 강의에서 질문 있습니다
안녕하세요. 장고 템플릿 내에서 리액트 컴포넌트를 사용하는 방식이 아니라, 리액트로 SPA (Single Page Application) 방식으로 애플리케이션을 구현하실 때에는, 매번 페이지 새로고침을 하는 것이 아니라 장고 서버로부터 JSON 타입으로 데이터만 받아오니깐요. // 이때에는 장고 템플릿을 통한 데이터 전달이 어려울 수도 있다고 설명드린 것입니다. SPA 방식이 아니라 장고 템플릿 내에서 사용할 UI 컴포넌트를 만드는 방식에서는 리액트 기술이든 Vue.js 기술이든 어떤 UI 기술을 쓰시더라도, 장고 템플릿을 통해 원하는 값을 전달해줄 수 있습니다. -- json_script 장고 템플릿 필터는 아래 지정 파이썬 객체를 JSON 문자열로 변환해주는 역할만 하구요. (사진) JS 코드에서 위 JSON 문자열을 읽어서, 직접 객체화하여 사용할 수 있습니다. 이 방식은 " 01-07 서버 사이드 렌더링과 클라이언트 사이드 렌더링 " 챕터에서도 소개해드린 적이 있는데요. (CSR 예시 #1. 0분 37초 부분) 해당 영상을 다시 한 번 살펴보시면 이해하시는 데에 도움이 되실 것입니다. 말씀하신 것처럼 message_list 는 여러 템플릿에서 사용될 수 있는 데이터니까, 매번 View에서 context data를 지정하는 것보다 context processor를 통해 지정했습니다. 그런 의미에서 장고 코어에서도 context processors를 통해 messages 및 user, request 등을 지원하고 있습니다. 살펴보시고, 아직 궁금한 점이 풀리지않으셨다면 추가 질문 남겨주세요. 화이팅입니다. -)
- 0
- 1
- 19
질문&답변
2024.04.26
django htmx 외에 몇 가지 질문 있습니다.
안녕하세요. htmx에서는 서버의 응답을 지정 dom에 업데이트시키는 것이 전부입니다. get_object_or_404를 통해서 발생된 404 응답에 대해서는 아래의 htmx:responseError 이벤트에 대한 리스너를 통해서 Toast 메시지를 띄우실 수 있겠구요. (myproj 프로젝트에 이미 적용되어있습니다.) document.body.addEventListener("htmx:responseError", event => { console.error("HTMX 요청 에러:", event.detail); const message = event.detail.error; const tag = "error"; htmx.trigger(document.body, "toast-message", { message, tag }); }); (사진) 혹은 get_object_or_404 를 래핑해서, 404 상황에서 htmx 요청의 경우, 단순히 404 응답이 아니라 화면에 보여줄 HTML을 응답하는 방법도 있습니다. 그리고, form_valid 메서드에서는 HttpResponse를 반환해야하구요. 반환된 응답 객체를 클라이언트 단에 그대로 전달됩니다. 그러니 해당 CBV에서 HTMX 요청에 대해 HttpResponseClientRedirect를 반환했다면 그에 맞춰 페이지 이동을 합니다. 브라우저 Network 탭을 통해 응답 헤더에서 HX-Redirect 헤더가 있는 지 확인해보시구요. 디버거를 물려서 해당 로직이 오류없이 잘 수행되고 있는 지도 확인해보세요. Image에는 rgb/rgba 외에도 다양한 mode가 있으니, rgb 모드가 아닐때 변환하는 접근이 필요할 듯 하네요. 강의에서는 직접 이미지 변환을 수행했지만, 아래 django-imagekit 라이브러리 사용도 추천드립니다. https://github.com/matthewwithanm/django-imagekit 질문 감사드리구요. 화이팅입니다~! 👍
- 0
- 1
- 61
질문&답변
2024.04.22
django, next.js 관련 질문 있습니다.
안녕하세요. django-silk 라이브러리가 페이지 프로파일링하기에 편리합니다. 이 외에도 https://github.com/orgs/jazzband/repositories 와 https://github.com/adamchainz/?tab=repositories 에서 다양한 장고 라이브러리를 만들어서 공유하고 있으니, 쭈욱 살펴보시는 것을 추천드립니다. 그리고 https://django.wtf/ 사이트에서 깃허브 스타 수 기준으로 핫한 장고 라이브러리 리스트도 제공되니 같이 살펴보세요. 파이썬 파일 내에서 CSS 클래스에 대한 자동완성 부분은 IDE에 추가 설정을 해볼 수도 있지 않을까 싶은데요. 아직 잘 모르겠습니다. 살펴보고 방법을 찾게되면 공유드리겠습니다. 파이참 프로페셔널에서는 django를 공식지원하니깐요. 장고 템플릿에 대해서도 reformat을 지원해줍니다. Reformat Code 메뉴는 상단 Code 메뉴에 있구요. Settings -> Tools -> Actions on Save 메뉴에서 "Reformat code" 옵션이 있습니다. "Reformat code" 옵션을 체크해주시면, 장고 템플릿 등에서 파일 저장 시에 Reformat code도 같이 수행됩니다. 하이브리드 방식에서 장고와 리액트 간의 비중은 서비스에서 정하기 나름일텐데요. 강의에서는 장고 위주로 페이지를 운영하면서, 장고 템플릿 내에서 리액트 컴포넌트를 사용하구요. 특정 페이지를 Next.js를 통해서 서빙하면서 장고 인증 세션을 같이 사용하는 방법에 대해서 다룰 예정입니다. // 리액트와 같은 프론트엔드 기술들의 유행들은 자주 바뀌니깐요. Next.js 유행도 언제 바뀔 지 모릅니다. 장고로 중심을 잡아주고, 장고 중심으로 서비스를 개발하는 방법을 다루려 합니다. 필요에 따라 다른 프론트엔드 라이브러리와 섞어서 개발을 할 수도 있겠죠. 말씀하신 것처럼, 장고 폼을 사용하고 그 외 조회용 페이지에서 리액트를 사용하는 접근도 좋은 접근입니다. 장단점은 어떤 입장에서 보느냐에 따라 다를기에, 저는 선택의 문제일 뿐이라고 생각하거든요. 그래서 마땅히 단점이라고 생각되는 부분은 잘 모르겠습니다. 그런데 장고 폼에서는 각 필드값이 변경될 때의 유효성 검사에 대해서는 좀 더 보완이 필요하거든요. 장고와 리액트를 보다 긴밀하고 간결하게 연계하여 폼 처리를 하는 부분에 대해서는 저도 아직 다방면으로 연구 중입니다. 이 부분에 대한 연구 때문에 본 강의 준비에 더욱 시간이 걸렸었는데요. 일단 강의를 완료지은 후에, 추가 컨텐츠로 제공해드릴 예정입니다. 여러 좋은 질문들 주셔서 감사드립니다. 댓글로 다양한 의견 나눠보면 좋겠네요. 👍
- 0
- 1
- 80
질문&답변
2024.04.19
11-23 컴포넌트가 제대로 동작하지 않는것 같습니다.
아. 0.67 버전에서 context variables 처리하는 부분에서 변경점이 있나봅니다. 공식문서 : Version 0.67 CHANGED the default way how context variables are resolved in slots. 0.67버전으로 올리니 저도 해당 이슈가 발생합니다. 일단 django-components 라이브러리는 0.61 으로 내리시면, 강의와 동일하게 동작하실 것이구요. 0.67 버전에서의 해당 이슈에 대해서는 제가 파악을 해보고 나서, 다시 댓글 달도록 하겠습니다. 👍
- 0
- 3
- 150
질문&답변
2024.04.19
11-23 컴포넌트가 제대로 동작하지 않는것 같습니다.
누락된 스샷을 다시 올려주셨네요. 방금 봤습니다. with 절을 추가 여부에 따라, 렌더링 결과가 달라진다는 말씀이시죠? 잘 이해가 되지 않는 동작이네요. django_components 라이브러리 버전은 어떻게 되시나요? 저는 현재 0.61 입니다.
- 0
- 3
- 150