목록개발일지 (31)
슈코딩
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bk0F6H/btrBR9Hh6Vh/ciWpVVDREM00Tnkjusl4VK/img.jpg)
10조 김삼이일 KTLO:KIM THREE LEE ONE 1) 한 일 프로젝트 명: Carstagram 백엔드 기반 인스타 클론코딩 프로젝트 필수 작업: (1) DB 연동하는 기능은 기본 CRUD(Post,Get) 포함 (2) 회원가입, 로그인, 로그아웃 기능 (JWT Jason Web Token 사용) - 입력 데이터는 인스타 페이지 참고한다. (3) 마이페이지 게시물, 게시물 활동 (4) 피드관련 사진 업로드 기능, 댓글, 좋아요, 더보기 모달 기능 (5) Follower / Following 기능 (미구현) 추가 기능: 미구현 2) KPT 회고 1. Keep 1. 첫 프로젝트 때보다 발전된 기획 및 설계를 통해 방향을 잃었을때 작성해둔 기획 페이지를 통해 방향을 찾아갈 수 있었고, 기능 구현의 속도..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/dsFjRa/btrBIxblGHS/AzGgkqPhBkLI4Dj9PBrCC1/img.png)
1. 회원가입 기능 어제 오늘은 프로젝트 막바지여서 정말 정신없이 코딩에만 집중해서 시간을 보냈다. 우선은 팀원이 맡았던 회원가입이 완성되질 않아서 프로젝트 진행에 차질이 생겨서 붙어서 해결을 해야 진행이 가능해지기때문에 회원가입 기능을 만드는데 집중을 해서 만들어 나갔다. @app.route('/sign_up', methods=['POST']) def register(): name_receive = request.form['name_give'] pw_receive = request.form['pw_give'] nickname_receive = request.form['nickname_give'] email_receive = request.form['email_give'] date_receive = re..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/TMG5T/btrBtBW7DyE/xah5mS3kcb5vmTvCwyigzK/img.png)
1. 진행상황 #구현한 기능 >Carstagram컨셉에 맞는 느낌의 배경디자인 >회원가입 페이지 레이아웃, 기입한 정보 DB에 저장, 비밀번호 암호화 >로그인 페이지 레이아웃, (로그인시 토큰 유지 방법 구현중) >메인페이지 게시글 댓글 기능 >메인페이지 게시글 사진업로드 및 게시 기능 #구현해야 할 기능 >회원가입 페이지 백엔드 기능 >로그인,로그아웃 기능 >좋아요 기능 >댓글 모두보기 (모달) 기능 >마이페이지 게시물 올리기, 각게시물 (모달) 댓글,좋아요,타임스탬프 기능 2. 진행중 어려웠던 점 1. 경로문제 > app.py 에서 로컬서버로 실행을 해서 페이지를 불러오는 과정에서 불러오지 못한 경우가 많았음. @app.route('/') def main(): return render_template..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/rm1Lc/btrA8Vji7Rs/NtbkPzvZAxI2hkRrHKM9t0/img.gif)
1. Git 특강 오늘은 저번 프로젝트의 연장으로 Flask와 DB를 이용한 일주일간의 백엔드 프로젝트가 시작되는 날이었다. 오전에는 팀프로젝트를 시작하기에 앞서 협업에 필요한 Git에관한 강의를 들었다. 강의는 해외수업처럼 주제를 던져주시면 Brainstorming 하며 팀원끼리 의견을 주고받고 스스로 생각을 해보며 미션들을 수행하는 방식으로 진행이 되었다. 우선 프로젝트에 관한 Ground Rule을 정하고 피드백을 받는 방식으로 처음에 진행이되었다. 설명을 듣고 Git에관한 기능과 활용방법들, 그리고 알아야 할 용어들이 한 두가지가 아니여서 진짜 막막해지는 시간이었다.. 한편으로는 벽을 느끼게 만드는 수업이었지만 그래도 잘하게된 다면 가능한것들이 무궁무진하기 때문에 실습을 통해서 적용해보는 방법 밖..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/mtNvJ/btrA0X8i1zt/OjsKZbBv3EOE2wtmlVTREK/img.png)
1. 메인페이지 오늘은 프로젝트를 제출하는 날이다. 메인페이지에서는 1일차때 만든 틀에서 사진,텍스트의 크기와 위치를 더욱더 인스타와 비슷하게 수정을 하는 작업을 메인으로 했다. 주요 어려웠던 작업은 스토리 라인 사진의 테두리에 그라데이션 넣는거랑 우측단을 position: sticky로 고정 시키려고 했을때 안되는 어려움도 있었고, 또 모달기능이 어려웠다. 전체적인 위치를 실제 인스타와 흡사하게 만들기위해 정말 많은 시간을 썼는데 이때 이런저런 코드들을 새로알게되고 크롬 검사창에서 미리 바꿔서 수정해보는 등 기존에는 써보지못한 것들을 많이 해본것같다. 구현하지 못한 기능은 반응형웹기능인데, 반응형 웹에 관한 공부도 추가적으로 더 많이 해야 적용을 시킬 수 있을것같단 생각이 많이 들었다. 혼자서 관련 자..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/oQ7hk/btrAJKoptcm/zWxjg42IgxCC4KQezYsHFK/img.png)
1. 기획 오늘은 인스타그램 UI 클론 코딩 프로젝트를 시작한 날이다. 인스타그램 메인페이지와 똑같은 모양의 페이지를 구현하는 프로젝트다. 최근에 Git 에대한 간단한 개념을 배우게 되서 오늘 프로젝트부터는 Git을 사용하는 연습을 했다. 기획하는데에 있어서 어느 부분부터 만들어갈지 오늘은 피그마에서 계획을 세워봤다. 계획을 세운 다음은 바로 목업도 그려서 내가 만들어야하는 페이지에 어떠한 요소들이 들어가는지 파악했다. 2. 제작 #메뉴바 맨처음 했던건 상단에 있는 메뉴바부터 만들기시작했다. 부트스트랩에서 메뉴바 레이아웃을 가져오고 아이콘은 구글폰트 아이콘에서 가져와서 사용했다. 오른쪽 끝에 있는 작은 프로필은 사진에 css를 적용해서 작게 만들었다. 한가지 영상을 찾다가 알게된점이있는데, 클론 코딩할때..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/RtYgp/btrAFaF29yR/iU0xJv4lNc0PqBSyGX7pH0/img.jpg)
1. 이번에 한 파이썬 게임만들기 프로젝트 회고 #Keep -코드를 짤줄 모르는부분에 대해서 자료를 열심히 찾아보고 공부하면서 진행 -차근차근 기능을 하나씩 구현하면서 많은 오류가 생겼었는데, 이를 풀어나가는 과정에서 많은 성장을 할 수 있는 기회가 생김 -제한 시간 안에 프로젝트를 완성 #Problem -기획단계를 너무 가볍게 지나쳤고, 간단한 게임도 어렵게 느껴져서 목업을 그리지 않고 진행 -첫번째 짠 코드에 기능을 추가하려고 하니, class를 이용해야 적용시킬 수 있어서 처음부터 다시 코드를 작성하고 두가지를 합치는 과정에서 어려움을 많이느낌 -git을 활용할줄 몰라서 프로젝트 버전관리를 제대로 못한점 #Try -기획을 체계적으로 하는 습관을 들인다. -목업할때 쓰는 사이트를 적극적으로 활용해본다..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bvVAaf/btrAwGzDFiH/aJ9NYt4YE7Tznqz7X4KDak/img.png)
1. 기본틀 배워서 가져오기 오늘은 파이썬 미니게임 만들기 프로젝트를 진행했다. 어제는 파이썬 문법에 관한 강의를 듣고 이를 바탕으로 프로젝트를 해보는 시간이었다. 나는 벽돌부수기 게임을 가지고 간단하게 만들어보고 기능을 추가해보는 식으로 프로젝트를 진행하기로 계획을 세웠다. 우선은 파이썬으로 게임을 만들기위해 pygame 패키지를 설치해야 한다. 패키지 설치가 끝나면 import pygame 을해서 라이브러리를 가져온다. import pygame YELLOW = (255, 255, 0) GREY = (150, 150, 150) # 색의 RGB 지정 BLACK = (0, 0, 0) pygame.init() # 초기화 (반드시 필요) # 화면 크기 설정 background = pygame.display.s..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/b6Veg6/btrAbKPSOuq/J3GzVNqEVhO3b1og5dI4mK/img.jpg)
10조 김삼이일(KTLO:KIM THREE LEE ONE) 1. 한 주의 흐름 1) 한 일 프로젝트 명: frontend를 기반으로 만든 자기소개 페이지 만들기 프로젝트 필수 작업: 마이페이지 기본 기능 구현 추가 작업: 애니메이션 기능을 추가하고 링크추가 구현 2) KPT 회고 2. Keep 1. 서로 모르는 부분에 대해 질문했을때 적극적으로 아는 부분에 대해서 알려주고 다같이 해결하려는 자세 2. 내가 구현하고자 하는것을 안되더라도 끝까지 포기하지 않는 자세 3. 아이디어를 생각하면 팀원에게 공유해 보는것 3. Problem 1. 찾아온 소스를 적용하려고 했을때 구현이 안된점 2.코드를 하나로 합치려고 했을때 파일간의 경로문제 떄문에 원활하게 되지 못했던점 3.팀 프로젝트의 기획단계가 미흡했던 점. ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/boggC7/btrz2qSrg9J/n4CKLv8q2NLHxFleHf6ki1/img.gif)
1. 개별 자기소개 페이지만들기 오늘은 메인페이지에서 링크타고 들어갈 자기소개 페이지를 만들었다. 팀원들이랑 상의 해봤을때 한명의 레이아웃을 채택하여 통일감을 줄까도 생각했었다. 그렇게 하면 프로젝트적으로는 더 완성도가 높을 수도 있지만, 자기소개 페이지는 각자의 개성을 살려서 만들면 더 자기자신을 잘 표현할 수 있겠다고 생각했다. 그래서 오늘은 개성을 살려서 지금까지 배운걸 혹은 더 공부를 해서 원하는 페이지를 만들어보기로 했다. 우선은 어제 MOCKUP할때 그린 기본 레이아웃을 참고해서 나는 스크롤없이 원페이지로 끝내기로 계획을 하고, 메인페이지의 뼈대를 가지고와서 제목만 남기고 전부 삭제해서 뼈대를 만들어 나갔다. 이렇게 배경사진도 제일 좋아하는 드림카로 설정해두고 글씨가 잘보이도록 배경을 어둡게하..