기타52 작정하고 장고 - Bootstrap을 이용한 Form 디자인 정리 Bootstrap을 이용한 Form 디자인 정리 django-bootstrap4를 설치한다 settings.py에 추가해준다. login.html에서 {% extends 'base.html' %} {% load bootstrap4 %} {% block content %} Login {% csrf_token %} {% bootstrap_form form %} {% endblock %} 상단에 {% load bootstrap4 %}를 추가해주고, form 대신 {% bootstrap_form form %}로 변경해준다. bootstrap이 적용된 form을 볼 수 있다. style을 살짝 추가해주었다. {% extends 'base.html' %} {% load bootstrap4 %} {% block co.. 2023. 5. 10. 작정하고 장고 - login, logout 구현 22강 : login & logout 구현 accountapp urls.py path('login/', LoginView.as_view(template_name='accountapp/login.html'), name='login'), path('logout/', LogoutView.as_view(), name='logout'), accountapp urls.py에 login, logout을 추가해준다. {% extends 'base.html' %} {% block content %} Login {% csrf_token %} {{ form }} {% endblock %} login.html을 만들어준다. 하지만 로그인을 하면 오류가 발생한다. login, logout view에서 redirect하는 매커니.. 2023. 5. 9. 작정하고 장고 - CreateView를 통한 회원가입 구현 21강 views.py 클래스형 view로 다음과 같이 코드를 작성해준다. class AccountCreateView(CreateView): model = User form_class = UserCreationForm success_url = reverse_lazy('accountapp:hello_world') template_name = 'accountapp/create.html' 함수형 view에서는 다음과 같이reverse('accountapp:hello_world')) reverse를 사용하지만 클래스형 view에서는 reverse_lazy('accountapp/hello_world.html') 처럼 reverse_lazy를 사용한다. 이후 accountapp./urls.py에 path('crea.. 2023. 5. 8. 작정하고 장고 - for 루프, 디버깅 18강 - DB 정보 접근 및 장고 템플릿 내 for loop views.py def hello_world(request): if request.method == "POST": temp = request.POST.get('hello_world_input') new_hello_world = helloWorld() new_hello_world.text = temp new_hello_world.save() return HttpResponseRedirect(reverse('accountapp:hello_world')) else: hello_world_list = helloWorld.objects.all() return render(request, 'accountapp/hello_world.html', conte.. 2023. 4. 11. 작정하고 장고 - GET, POST 16강 : GET, POST 프로토콜 실습 form 태그 hello_world.html에 form 태그를 추가해준다. {% extends 'base.html' %} {% block content %} Testing {% csrf_token %} {{ text }} {% endblock %} 위 코드에서 form 태그 내부에 POST 타입의 input 태그를 만들어준다. 이때 {% csrf_token %} 를 추가해줘야 하는데 해당 구문은 장고를 이용해서 POST method를 사용해서 서버에 요청을 보낼때 항상 form 안에 명시해줘야한다. (보안기능중 하나이다.) 해당 구문을 추가하지 않으면 다음과 같이 오류가 발생한다. veiws.py from django.http import HttpResponse.. 2023. 4. 10. 작정하고 장고 - models.py, db 연동 14강 - Model, DB 연동 - makemigrations, migrate model 장고에서 model이란, database가 장고 내부에서 사용이 편하도록 연동시켜주는것 models.py models.py에 class helloWorld(models.Model): text = models.CharField(max_length=255, null=False) 해당 클래스를 만들고 python manage.py makemigtations 명령어를 실행한다. (models.py에 쓰는 내용을 DB와 연동시킬 파이썬 파일로 만들어주는 명령어) initial.py 파일이 생긴것을 확인할수있다. 연동시키기 python manage.py migrate 명령어를 통해 initial.py를 적용시켜준다. 15강 .. 2023. 4. 7. 작정하고 장고 - css display 속성, size 단위 12강 - CSS 핵심 - display 속성 및 Size 단위 px, em, rem, % display 속성 block 모든 태그에는 부모가 존재하는데 부모의 모든 너비를 가져가고 블록형태를 가지는 태그 inline 글씨의 높이 만큼 한줄내에 일정 부분만 들어가는 속성을 가진 태그 inline-block 블록이지만 인라인이다(오른쪽으로 쌓임) none 태그는 존재하지만 브라우저에 보이지 않는데 아래와 같이 적용된다 ↓ visibility-hidden hidden과 none의 차이 size px 부모 태그에 상관없이 고정된값 em 부모의 값이 2배가 증가하면 자신의 값도 같이 2배 증가한다. 하지만 부모가 2배증가되고 부모의 부모도 2배가 증가하면 4배 증가된다. -> 관리에 어려움이 있음 rem roo.. 2023. 4. 6. 작정하고 장고 - static 설정, css파일 분리 작정하고 장고 11강 - Static 설정 및 CSS 파일 분리 static 설정하기 settings.py에 추가하기 STATIC_URL = '/static/' STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles') STATICFILES_DIRS = [ BASE_DIR / "static", ] STATIC_URL 아래에 STATIC_ROOT와 STATICFILES_DIRS를 추가해준다. djangoProject에 static 폴더를 만들고 해당 폴더에 css파일을 만든다. css 파일 분리하기 html파일에 있던 style태그를 class태그로 변경하고 해당 class에 대한 style을 css파일에 옮기자. css파일 링크 추가하기 css파일은 head태그에 추가를.. 2023. 4. 5. 작정하고 장고 - 구글폰트, 부트스트랩 사용하기 작정하고 장고 10강 - style, 구글 폰트를 통해 Header, Footer 꾸미기 부트스트랩, 구글폰트 부트스트랩과 구글폰트를 추가해준다. header, footer에 css 적용하기 결과화면 2023. 4. 4. 이전 1 2 3 4 5 6 다음
