Programming 59

[Django, Docker] gunicorn에 vscode debugger 붙이기

※ gunicorn을 쓰지 않더라도 적용가능하니, 읽은 후 게시글 하단을 참고 What I want. django 작업을 하다보면 당연히 에러가 생기고, 어떤 변수에 어떤 값이 들어있는지 확인하는 경우가 많다. 현재 필자는 django가 docker container 내부에 있기 때문에 다음과 같은 일련의 과정을 거친다. 1. 해당 컨테이너의 로그를 띄워놓음(또는 docker-compose log) 2. 에러가 발생하는 지점 근처에 "감으로" 변수를 출력하는 print문을 출력 3. 코드를 저장 -> 코드를 실행 -> 코드를 저장(저장을 해야 로그가 다시 뜬다) 4. 변수 확인후 "아 이게 아니구나" 후 다른 변수 출력하는 print 추가 5. 2~5무한반복 꽤나 귀찮고 은근히 시간이 많이 드는 일이다...

Programming/Django 2021.10.20

[Vue 2] v-model과 .sync의 차이점

vue 관련 라이브러리들을 사용하다보면 변수.sync 로 작성된 코드들을 자주 만난다. 그냥 라이브러리 문법인가 보다 했는데 vue2->vue3 Migration Guide를 확인하는데 첫 번째 breaking change가 다음과 같다. v-model usage on components has been reworked, replacing v-bind.sync v-bind.sync를 v-model이 대신한다고 한다. 내용을 읽어보아도 잘 이해가 되지 않아서 다음 stackoverflow를 참고하였다. What is the difference between v-model and .sync when used on a custom component I don't understand the difference ..

Programming/Vue.js 2021.10.18

[HTML] select tag의 style 변경하기

, 사용법 select는 drop down menu가 나오면서 해당 항목을 선택할 수 있는 html tag이다. 이 때, 선택지들은 select tag 내부에 option tag로 작성한다. Volvo Saab Opel Audi 출처(테스트가능) vue를 사용한다면 다음과 같이 작성할 수 있다. ... {{car}} ... ... option에서 선택한 항목이 car라는 변수와 v-model로 동기화되어 변경된다. 그래서 style은 어떻게 변경? 위의 사진에서 볼 수 있듯이, select의 기본 디자인은 완전히 '기본'이다. 시스템에 따라 변경되지만 우리가 원하는건 현재 디자인에 자연스럽게 녹아드는 select이기 때문에 style 변경이 필요하다. ※ 참고 본격적으로 글에 들어가기 전에 vue를 사용..

Programming/Vue.js 2021.10.17

[Nuxt.js] nuxt.js에서 vue-echarts 사용하기

javascript에는 그래프를 위한 여러가지 라이브러리들이 존재한다. 오늘은 그 중 echarts를 소개한다. Examples - Apache ECharts echarts.apache.org 상당히 많은 양의 그래프가 존재하고, 디자인/애니메이션이 나름 트렌디하다고 생각한다. 물론 마음에 들지 않는 부분들도 있지만, 많은 요소들이 커스텀이 가능하기 때문에 사용성이 좋다. 위 예제들을 참고하자. vue-echart, nuxt-echart를 검색하면 다음과 같은 페이지를 찾을 수 있다. Vue-ECharts Apache ECharts component for Vue.js. ecomfe.github.io 아래로 스크롤을 내리다보면 nuxt.js의 setup이 나와있다. ... 자주 그러하듯, 작동하지 않는다..

Programming/Vue.js 2021.10.15

[DRF] get_queryset에서 벗어나기(get 사용)

drf에서 api를 구현할 때, 필자는 get_queryset을 메인으로 하여 api를 구성하였다. get_queryset을 사용하는건 아래의 docs를 참고하고 진행하였다. https://www.django-rest-framework.org/#quickstart Home - Django REST framework www.django-rest-framework.org https://www.django-rest-framework.org/api-guide/filtering/ Filtering - Django REST framework www.django-rest-framework.org 다만 이렇게 get_queryset만 사용하면 결론적으로 [sql로 할 수 있는것 + serializer의 보조] 만을 사..

Programming/Django 2021.10.15

Django foreign key를 사용했을 때 역참조(DRF)

결론부터 말하자면 참조하는 모델(ohlcv)과 참조되는 모델(share_announce)가 있을 때, 참조되는 모델.참조하는모델_set으로 접근가능하다. 이때, 참조하는 모델 foreign key 설정시 related_name을 설정해주면 해당 이름으로 접근할 수 있다.(필자는 ohlcv로 설정) 그러니까.. django가 알아서 해준다. 구글링을 했을 때, 정참조를 할 때는 select_related를 역참조를 할 때는 prefetch_related를 쓰라는 얘기를 보았다. 하지만 두 방식 모두 cache에 미리 담아둬서, db에 한 번 더 쿼리를 보내지 않게 해주도록 support하는 역할이지, 해당 function을 쓴다고 해서 return되는 query_set에 해당 내용이 담겨져있는게 아니다. ..

Programming/Django 2021.10.15

[Vuetify] v-data-table eslint에 맞춰서 사용하기

{{ item }}% // 이렇게 하면 헤더1,2,3 전부 object형식으로 나온다 {{ value }}% // 이렇게 하면 헤더2의 값만 나온다 headers: 컬럼명과, 그에 대응되는 object member name을 넣어준다 items: headers와 맞춰서 각 row에 들어갈 데이터를 object로, 그리고 각 obejct를 list로 묶어준다 그리고 템플릿을 작성할 때 주의 해야하는 것은 vuetify document에는 다음과 같이 적혀져있다 v-slot:item.헤더1="{ item }" // v-slot:item.calories="{ item } 하지만 위와 같이 작성하면 다음의 eslint에서 다음과 같은 에러를 보인다. error 'v-slot' directive doesn't s..

Programming/Vue.js 2021.09.30

postgres에 django를 활용해 csv 업로드 하기

필자는 mysql-nodejs로만 DB-API를 다루어 보았다. django를 사용하면 DRF(Django REST Framwork)와 ORM(Object Relational Mapping)이 매우 편하다는 얘기를 들어, 회사에서 새롭게 진행하는 프로젝트의 구조를 django-postgres를 사용해보기로 했다. 이번 작업은 기존에 정리해놓은 csv를 postgres로 업로드 하는 일이었다. 우선 처음 고민했던 사항은 1. 이걸 postgres로 바로 업로드해야하는가? 2. django를 통해 업로드해야하는가? 첫 번째 방법은 django의 ORM이 어떻게 구성되는지 모르겠으나, DB와 django가 독립적으로 돌아버리니 충돌이 날 수 있다고 생각이 들었고, 두 번째 방법은 csv와 같이 큰 파일을 업로..

Programming/Django 2021.09.29

Mediapipe를 활용한 vision-depending-display 제작: 에러모음(업데이트중)

1. npm 을 사용하여 media-pipe 사용하기 설명에 들어가기에 앞서, media-pipe는 javascript를 별로 좋아하지 않는 것 같다는 필자의 생각을 먼저 말한다. (공식 문서도 없고 원본 코드도 찾을 수가 없다...) https://google.github.io/mediapipe/solutions/face_mesh.html#javascript-solution-api 위 링크로 들어가면 javascript 버전의 face_mesh 코드가 적혀져있다. 다만, CDN 사용법 기준으로 적혀져있기 때문에 조금 찝찝하기 때문에 설명에 적혀져있는 npm을 다운받아보았다. ...? 그리고 npm 코드를 어떤 식으로 사용해야하는지는 공식문서 어디에도 적혀져있지 않았다. 어쨌든 npm이 있다는건 동작하는..

Programming/Web 2021.09.19

개발시 참고하면 좋은 페이지들(2021.09.19 기준)

RL MP(Marcov Process)부터 A3C(Asynchronous Advantage Actor-Critic)까지, tensorflow.js 시뮬레이션을 통해 쉽게 설명한 포스트 https://greentec.github.io/reinforcement-learning-first/ openAI Gym(cart pole 예제) http://www.secmem.org/blog/2019/03/09/OpenAI-Gym-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0/ openAI gym(cart pole 예제, colab기준) https://www.anyscale.com/blog/an-introduction-to-reinforcement-learning-with-openai-gym-rlli..

Programming 2021.09.12