[Django & Ajax] 실시간 채팅 구현

남들이 해놓은걸 보고 만들어볼 계획이었는데 주어진 시간에 비해 너무 어렵다. 조잡해질까봐 걱정이 되긴 하나 그렇게 복잡하지 않을 것 같아 그냥 직접 구현해보려한다. 어떻게 구현해야할까에 대한 고민 기왕이면 그나마 친숙한 Ajax를 이용하려한다. 대략적인 생각은 다음과 같다. ajax로 채팅내용을 뿌려주는 함수를 구현해놓고 일정주기로 함수를 호출해서 화면을 재구성하는 방식이다. 일정주기로 계속 호출을 한다는게 마음에 걸려서 다른 방식이 없을까 조사를 해봤는데 웹소켓말고 ajax를 이용하는 방식내에서는 어쩔 수 없는거같다. setInterval() https://developer.mozilla.org/en-US/docs/Web/API/setInterval setInterval() - Web APIs | MD..

→2021.10.24

웹 프로그래밍

[django] 다음글 or 이전글로 넘어가기 구현

팀찾기나 팀원찾기, 대회및 공모전의 detail 페이지 내에서 빠져나가지 않고 버튼을 눌러 다음 카드로 넘어갈 수 있게 하고 싶었다. 현재 URI는 /teams// 나 member/detail/ 이런식으로 만들어져 있다. 처음엔 단순히 pk+1, pk-1이런식으로 페이지를 넘길수 있게하면 되겠다 생각해서 쉽게 생각했는데 삭제된 글이 있다면 중간에 pk가 연속적이지 않을 수도 있고 팀원찾기의 경우엔 slug로 만들어놔서 그 문제도 있었다. 어떻게 할것인가? 글의 목록을 리스트로 받아오고, 현재 위치한 글의 인덱스를 찾은 다음 pk가 아닌 인덱스 번호를 움직여 페이지를 리다이렉트시킬 수 있게하면 될 것 같다. custom_tags.py 나 views.py에서 구현하면 될 듯. 시간될 때 구현하고 이어서 작성..

→2021.10.19

웹 프로그래밍

[Django Error] circular dependency

ImportError: cannot import name 'User' from partially initialized module 'accountapp.models' (most likely due to a circular import) Circular dependency 코드가 점점 커지다 보니 의존성문제가 발생하기 시작했다. models.py 사이에서 import로 얽힌 연관성이 무한하게 반복된 것이다. django가 import를 무한하게 반복하게 되어 발생하는 문제다. 특히 foreign key 관계에서 자주 발생한다. 예를 들어 방금의 경우엔 from accountapp.models import User 여기서 에러가 발생했다. 이런경우엔 지워주고 import accountapp 만 해준후에 원래..

→2021.10.18

웹 프로그래밍

리다이렉션한 횟수가 너무 많습니다

devdreamers.kr 의 사이트 리뉴얼 공지를 위해서 모든 url 에 대해 사이트이전 공지 url로 리다이렉트를 시켜려는 과정에서 문제가 발생하였다. 꿈꾸는 개발자들 팀을 찾거나 모으기 힘들 때 꿈꾸는 개발자들 devdreamers.kr django middleware에서 처리를 하려했고 아래와 같이 처리하려했었다. class RedirectMiddleware: def __init__(self, get_response): self.get_response = get_response def __call__(self, request): response = self.get_response(request) if request.environ['PATH_INFO'].startswith('/'): return r..

→2021.10.15

웹 프로그래밍/Svelte

[Svelte-demo (2)] 이벤트 핸들링

Hello {name}! {isRed = !isRed}} on:mouseenter={() => {name = 'enter'}} on:mouseleave={() => {name = 'leave'}} > Box! on: (on directive)은 addEventListener에 붙일 수 있는 모든 이벤트들을 다 작성할 수 있다. {text} {text = e.target.value}} /> {text = 'duckracoon'}}> 방법1 {text = 'duckracoon'}}> 방법2 양방향 바인딩

→2021.10.06

웹 프로그래밍/Svelte

[Svelte-demo (1)] 선언적 렌더링/조건문과 반복문

조건문 사용 {toggle = !toggle}}> {name} {#if toggle} Hello {name}! {:else} No name! {/if} 반복문 사용 Hello {name}! {#each fruits as item} {item} {/each} Delete Fruit

→2021.10.06

웹 프로그래밍/Svelte

[Svelte] 개발환경

VSCode에서 환경을 만들어보려한다. Svelte를 코딩하기위해서는 Svelte Template을 개발환경으로 가져와야하는데 그러기위해서 Node.js가 설치되어야한다. v14.15.5를 사용하고 있고 npm은 v6.14.11이다. https://github.com/sveltejs/template GitHub - sveltejs/template: Template for building basic applications with Svelte Template for building basic applications with Svelte - GitHub - sveltejs/template: Template for building basic applications with Svelte github.com ht..

→2021.10.06

웹 프로그래밍/Svelte

[Svelte] Svelte를 배워보자

0. 왜 Svelte를 공부하려하는가 프론트를 좀더 공부해 보고 싶었고, 대충 고려해본 선택사항에 원래는 vue.js, react.js가 있었다. 그런데 이런 걸 보게 되었다. https://2020.stateofjs.com/en-US/technologies/front-end-frameworks/ 2019년 출시되자마자 만족도 2위를 차지했고 2020년 react를 넘어섰다. 얜뭘까하는 생각이 들어 알아봤다. Svelte? Nov 2016 1.0 Release Apr 2018 2.0 Release Apr 2019 3.0 Release - Write less code - No virtual DOM 가상 돔이 없다? Diffing, Overhead가 없다고한다. 가상돔을 생성하고 비교하는 비용이 없다는 것...

→2021.10.06

웹 프로그래밍

AWS Load Balancer에서 HTTP서 HTTPS Redirect

nginx.conf 에서 설정을 통해 시도 했는데 잘되지 않았다. 지금까지 구성에 Load Balancer가 없었기에 대문역할을 nginx가 했었지만 Load Balancer를 적용한 이후로 대문역할은 Nginx가 아닌 Load Balancer가 맡게됨에 따라 소용이 없었던 것이다. 설정 방법은 아래 Stack overflow를 참고했다. https://stackoverflow.com/questions/24603620/redirecting-ec2-elastic-load-balancer-from-http-to-https Redirecting EC2 Elastic Load Balancer from HTTP to HTTPS I want to redirect all the HTTP request to https..

→2021.09.11

웹 프로그래밍

(Error) HTTPS/SSL 적용 (Let's encrypt) - 2 , nginx

nginx: [emerg] cannot load certificate "/etc/letsencrypt/live/oconnect.kr/fullchain.pem": BIO_new_file() failed (SSL: error:02001002:system library:fopen:No such file or directory:fopen('/etc/letsencrypt/live/oconnect.kr/fullchain.pem','r') error:2006D080:BIO routines:BIO_new_file:no such file) 이런 에러를 뿜어내고 있다. .pem 파일을 못찾겠다는거 같은데 경로문제는 없는거 같아서 확인/해결 후 원인을 기록하도록 하겠다. nginx.conf worker_processes a..

→2021.09.07

티스토리툴바