캐나다 개발자

오늘의 목표 플러스강의 4주차 팀공부 JWT 예제 / JInja2 Template 공부 팀작업 미니프로젝트 맡을부분 확실히 정하기, 작업시작 게시물확인.html,css 완성 회원정보 DB에 저장되면 Jinja2로 가져와서 사용 개인공부 CSS - Inline, Block 개념 정리 전산학공부 1일 1로그 100일 완성 001 ~ 003 알고리즘공부 백준 1단계 - 입출력과 사칙연산 개인작업 React - Home.js 마무리 해시함수 - 항상 똑같은 길이의 암호함수를 돌려준다 - 결과값을 가지고 원래값을 유추할 수 없다. PyJWT Python에서 JWT를 사용 하기 쉽게 만든 패키지 회원가입 - 로그인 순서도로 JWT와 해시함수등 이해 1. 회원가입 아이디 비밀번호 정규표현식 (규칙생성) functio..

OT 미니프로젝트 기획 기획멘토링 TIL 강의 정도가 진행되었다. 기획멘토링이 도움이 정말 많이 됬던거 같다. 프론트엔드는 백엔드의 고객이다. 유저들은 프론트엔드의 고객이다. 이 말이 뭔가 많이 와닿았다. 실제로 백엔드의 자료를 프론트 엔드가 받아서 유저들에게 보여주는 시스템이니까. 미니프로젝트 기획은 거창했다. 하지만, 구현이 가능할까? 라는 멘토님 말씀에최소한 필요 기능만 구현을 먼저 하기로 결정했다. 내 파트였던 크롤링 부분이 빠지게되는 위기에 처해지면서, 어느 부분을 할지 고민하다가, 메인페이지 작업을 협동해서 끝내기로 하였다. + 다른부분도 서로 도와가면서 일단 오늘 남은 시간은 얼마없지만오늘의 계획은 1. JWT / 쿠키 / 세션에 대해서 공부 2. Jinja2 템플릿에 대해서 공부 정도로 끝..

프로젝트 명칭 - 강아지 모여모여 설명 반려견의 일상을 기록하고, 다른 견주들과 소통할 수 있는 SNS 강아지에 대한 궁금증을 검색하고, 유기동물에도 관심을 가져본다. 개발자 - 고승준, 김준호, 신상우, 장세화 - 총 4명 담당기능 고승준 - 메인페이지 / 게시물 업로드 (사진업로드) / 게시물 확인 / 좋아요, 댓글 기능 김준호 - 유기동물정보 크롤링 / 강아지 품종 검색, 검색후 정보 크롤링 신상우 - 로그인 / 회원가입 (사진업로드) 장세화 - 프로필 페이지 (본인, 다른사람) / 프로필 수정 (사진 업데이트) 개발기간: 2022.05.09 ~ 13 - 총 4일 개발환경 Client - HTML, CSS, JS - Jquery (ajax() - GET, POST) Server - Python(Fl..

https://github.com/kevinkim910408/-Web-MoiveSite/blob/master/README.md 레파지토리를 보기 좋게 꾸며보았다. https://simpleicons.org/?q=bootstrap https://shields.io/ 위의 두 사이트가 깃헙 기술뱃지를 추가하는데 도움이 많이 된다. 아래는 내가 만들어 놓은 코드다. - - - - - - - - 토이프로젝트4 - 사전준비의 마지막날이다. 지금까지 배운기술, 그리고 배우고싶은 기술을 다 사용하고자 한다. 사용하고자 하는 기술 목록 HTML, CSS (Scss), JS-fetch()로 api get, Bootstrap(React) React, React Router JWT Python, Flask MongoDB 나..

드디어 완성이다. 다 만들고 다른사람들의 작품을 보는데 주눅이 들긴 한다. 그냥 넷플릭스 느낌만 나게 해봤다. https://kevinkim910408.github.io/-Web-MoiveSite/ 이번 토이프로젝트에서 정말 많은것을 얻어간다. 1. React - Bootstrap 설치 npm install react-bootstrap bootstrap 최상단의 루트파일인 src/index.js 또는 App.js 파일에 코드를 추가하면 부트스트랩의 스타일을 적용할 수 있다. import "bootstrap/dist/css/bootstrap.min.css"; - 원하는 컴포넌트 불러오기 버튼을 넣으려고 하는 컴포넌트 파일 상단에 코드를 추가한다. import Button from "react-bootstr..

React.js 로 toDo import logo from './logo.svg'; import './App.css'; import { useEffect, useState } from 'react'; function App() { // toDo를 입력받을 state const [toDo, setToDo] = useState(); // 모든 toDo를 array로 관리할 state const [toDos, setToDos] = useState([]); // toDo 입력받기 const onChange = (event) => { setToDo(event.target.value); } // Form태그 Submit const onSubmit = (event) => { event.preventDefault();..

벌써 7일차다. JSX - 자바스크립트를 확장한 문법. - 생긴게 HTML이랑 비슷하다. // jsx를 사용한 react const title = console.log("mouse enter")}>HI React // jsx를 사용안한 react const title = React.createElement("span", {id:"title", onMouseEnter:()=>console.log("mouse enter"), "HI React"); JSX를 사용하는 쪽은 그냥 HTML이라고 해도 무방할정도다.. Babel - JSX로 적은 코드를 브라우저가 이해할수 있는 형태로 변환해준다. JS로 button을 만들어 클릭시 count를 세면, html의 button, span 그리고 innerText가 모..

웹개발 플러스 1주차가 수강기간이 끝나서 pdf로 공부를 하고있는데, python flask에서 웹스크래핑을해서 POST하는것을 보았다. 즉, client에서는 url을 보내주고, server에서는 url을 받아서 그 url을 토대로 필요한 정보를 웹 스크래핑을 진행하는 내용이다. 생각해보면 간단한 이야기지만, 이런방법도 있구나 라는 생각이 들었고, 이번 토이프로젝트2는 이 내용들을 들어가게해서 진행할 예정이다. 생각해보니까, 코드를 나열하거나 사진을 붙이는거 보다 깃헙에 사진을 넣고, 코드에 주석을 붙이는게 나을거 같다는 생각이 들었다. 플러스1 - 나의 일기장 https://github.com/kevinkim910408/-Web-Diary 플러스1 - 영화 기록하기 https://github.com/..

사전준비 4일차 웹개발 종합반, 토이프로젝트1 등이 끝났다. 오늘은 2일차에 못끝냈던 react를 이용해서 CRUD를 구현해보고 입학시험을 준비하였다 ---------------------------------------------------------------------- 공부시작 --------------------------------------------------------------------- 1. React CRUD import './App.css'; import {useState} from 'react'; // useState를 사용하기위한 import // Components function Article(props){ // 파라미터를 통해서 속성에 접근가능 return {props...

Flowchart에 따른 순서도를 구체화 1. 파이참으로 세팅 - 폴더세팅 - flask를 이용할 것이므로, static, templates 폴더 준비 - Interpreter세팅 - flask, pymongo, dnspython 2. HTML, CSS로 Client 페이지 작업 3. Flask로 Get(페이지시작될때), Post(검색버튼누를때) 연결 4. API Key로 데이터 잘 받아오는지 체크 5. 검색버튼구현 - 3,4번을 할때 같이 해버렸다.. 6. POST - 3,4번을 할때 같이 해버렸다.. - Client: 도시이름 서버로 보내기 - Server: 도시이름 DB로 보내기 7. Get - 3,4번을 할때 같이 해버렸다.. - Server: 도시이름 DB에서 받아오기 - Client: 도시이름..