개발자 시선

이번 글에서는 Flask로 구현한 코드 소개와 제가 Next.js로 구현했던 기능을 어떤 식으로 구현했는지도 함께 설명해보려고 합니다. 글을 작성하다보면 리액트와 Jinja2를 비교하는 글이 될 것 같기도 합니다 :)공통 레이아웃 만들기Next.js에서 app/layout.tsx으로 공통으로 사용할 레이아웃을 만들듯, Jinja2에서도 어떤 페이지에서든 동일하게 사용할 레이아웃 템플릿을 만들 수 있습니다. 예를 들어, 아래 이미지에서 빨간색 박스로 표시한 사이드바를 모든 페이지에서 공통으로 사용하기로 했다면 jinja2로 다음과 같이 코드를 작성할 수 있습니다. 일단 먼저 templates 폴더에 layout.html 파일을 생성해줍니다. 그리고 layout.html 파일에는 어떤 페이지에서든 어디에서..

Flask와 Jinja2로 개발을 시작하려고 보니 prettier와 Black을 설정하지 않아 코드가 일관된 형식으로 작성되지 않는 게 염려되어 먼저 환경 설정을 하고 시작하려고 합니다. 사실 Black은 이번에 Python 개발을 하게 되면서 처음 알게 된건데, Python은 Black, autopep8, YAPF 등 별도의 포맷터를 사용한다고 하더라구요. 저는 이 중에서 가장 널리 쓰인다는 Black을 사용해보려고 합니다.Prettier 설정하기일단 먼저 prettier 부터 설정해보겠습니다. 1. VS Code에 Prettier Extension이 설치 되어 있지 않다면 Prettier를 먼저 설치해주세요.2. npm으로 prettier-plugin-jinja-template를 설치해줍니다. 만약에..

개발 동기Next.js를 사용해서 개발했던 프로젝트를 Flask와 Jinja2로 개발해보려고 합니다.Flask와 Jinja2로 개발하게 되는 이유는 지원하고싶은 회사에서 해당 스택으로 개발을 하는 부분이 있다고 하여 이와 관련된 프로젝트를 포트폴리오로 만들고 싶어서 시작하게 되었습니다. 사실 이름만 들었을 때는 낯설었지만 Jinja2로 작성된 코드를 보니, 예전에 Express 프레임워크에서 ejs로 개발했던 것과 유사한 형태라서 크게 어렵게 느껴지지는 않았습니다. Flask와 Jinja2란?일단 설치에 대해서 설명하기 전에 가볍게 Flask와 Jinja2가 무엇인지 설명하고 넘어가보겠습니다. Flask(공식 링크)는 쉽고 빠르게 사용할 수 있도록 설계된 Phtyon용 웹 애플리케이션 프레임워크이고,Ji..