Projects/Flask 할일리스트 (8) 썸네일형 리스트형 #7. 프로젝트를 끝내며 https://github.com/chanmin-kim/flask-todo chanmin-kim/flask-todo flask todo application . Contribute to chanmin-kim/flask-todo development by creating an account on GitHub. github.com 최종적인 코드는 위에서 볼 수 있다. Flask가 Django보다 편하긴 한데, 편한 걸 사용할 거라면, Node.js로 백엔드를 만들 것 같다. 프론트를 React로 만들경우, 백엔드까지 JavaScript로 만드는게 훨씬 편하기 때문이다. Python으로 백엔드를 만드는건 나름대로 이유가 있는건데, Python에 있는 각종 라이브러리들을 활용하기 위함인데, 그럴거라면 이미 라이.. #6. 아직 글을 작성하지 않았을 때 보여줄 화면만들기 할일 리스트에 아직 어떠한 할일도 적혀있지 않다면, 어떻게 해야할까? 별도의 백엔드로직을 구성할 필요없이, index.html에서 템플릿언어의 조건문을 사용해서 위와 같은 화면을 구성할 수 있다. {% extends 'base.html' %} {% block head %} Task Master {% endblock %} {% block body %} 도대체 무엇을 해야하나 //로직부분에서 index.html과 같이 렌더링한 tasks에 대한 조건문 //tasks에 아직 어떠한 할일도 담겨있지 않을 때 보여줄 화면 {% if tasks|length < 1 %} 할 일이 없습니다. 오늘은 제발 일 좀 하세요. //tasks에 할일이 하나라도 담겨있다면 보여줄 화면 {% else %} 할일 저장한 시간 수정/.. #5. 작성한 할일 수정하기 이번에는 수정하기 버튼을 눌렀을 때, 수정페이지로 이동하여, 글을 수정할 수 있어야 한다. 먼저 수정하기 버튼을 구현한다 {% extends 'base.html' %} {% block head %} Task Master {% endblock %} {% block body %} 도대체 무엇을 해야하나 할일 저장한 시간 수정/삭제 {% for task in tasks %} {{ task.content }} {{ task.date_created.date() }} //수정하기 버튼 구현 Update Delete {% endfor %} {% endblock %} 수정하기 버튼을 눌렀을 때, 우선은 수정페이지로 이동하게끔 로직을 짜야한다 @app.route('/update/', methods=['GET', 'POS.. #4. 작성한 할일 삭제하기 할일들을 작성하여 DB에 저장하고, 이것들을 다시 DB에서 꺼내와서 메인페이지에 띄워주는 작업까지 진행하였다. 이번에는 저장한 할일들을 삭제해주는 기능을 구현해야 한다. 이를 위해선 우선 삭제버튼부터 index.html에 만들어준다. {% extends 'base.html' %} {% block head %} Task Master {% endblock %} {% block body %} 도대체 무엇을 해야하나 {% if tasks|length < 1 %} 할 일이 없습니다. 오늘은 제발 일 좀 하세요. {% else %} 할일 저장한 시간 수정/삭제 {% for task in tasks %} {{ task.content }} {{ task.date_created.date() }} Update //Dele.. #3. 할일 리스트를 저장하고, 이 리스트를 메인페이지에 띄워주기 //index.html 코드 // 이하 생략 //할일 작성 후 submit을 누르면, /로 POST요청이 간다 {% endblock %} index.html에서 글쓰기 버튼을 만들어 놓았다. 이제 /로 POST요청이 갈 것이다. 이 부분에 대한 로직을 만든다. // '/'로 GET요청이나 POST요청이 왔을 때 @app.route('/', methods=['POST', 'GET']) def index(): // '/'로 POST요청이 온 경우 // 즉, 글쓰기 버튼을 누른 경우의 로직 if request.method == 'POST': //POST요청 중 content라는 이름을 가진 데이터를 task_content에 저장 task_content = request.form['content'] //task.. #2. 메인화면 세팅 복잡한 로직을 정하기 이전에 렌더링을 해주어야할 화면부터 잡아보자. 반복되는 코드 작성을 피하기 위해, base.html 그리고 템플릿언어 중 block, endblock을 활용하자. //바디 부분에서 각 페이지마다 달라질 부분 설정 {% block body %} {% endblock %} base.html을 위와 같이 작성해놓은 다음, 이제 index.html에서 base.html을 extends하여 달라지는 부분만 수정한다. {% extends 'base.html' %} {% block head %} Task Master {% endblock %} {% block body %} 도대체 무엇을 해야하나 //table의 형태로 할일들의 리스트를 띄워주어야 한다 할일 저장한 시간 수정/삭제 Update D.. #1. 프로젝트 세팅하기 python으로 무언가를 만들 때는, 가상환경을 무조건 만들어서 사용한다. 패키지 관리하는게 귀찮고, 버전이 하나 꼬이기 시작하면, 밑도 끝도 없기 때문이다. 특히 Django와 달리 Flask는 라이브러리들을 그 때 그 때 import 해야 해서 가상환경을 세팅하는 것이 좋다. To-do list는 아주 간단한 기능이기 때문에, 필요한 기능만 구현하고자, 프로젝트 폴더도 간단히 구성해놓았다. app.py에 들어가서 기존적인 세팅을 진행한다 //필요한 라이브러리 임포트 from flask import Flask, render_template, url_for, request, redirect from flask.wrappers import Request from flask_sqlalchemy import .. #0. Flask로 CRUD를 모두 구현해보기 기존에 Django를 사용하다가, Flask로 프로젝트를 진행할 일도 있고, Django가 Url이나 Logic 부분에 있어서 많이 엄밀하다고 느껴져서 보다 자유도가 높은 프레임워크를 경험하고자 간단한 서비스를 만들어봤다. Django는 자체적인 템플릿언어, Models.py와 같은 모든 것들이 다 갖추어져 있고, 정해진 양식에 따라서 서비스를 구현해야 했는데, Flask는 제약없이 만들 수 있다는 점이 Node.js의 Express 프레임워크와 유사하다고 느껴졌다. 백엔드는 Django, Node.js(Express), Flask순으로 다뤄봤는데, 프레임워크들을 사용하면 사용할수록 거의 모든 웹프레임워크들이 유사함을 느낀다. React와 React Native가 유사한것처럼! 결론적으로는, Flask를.. 이전 1 다음
