728x90

Sparta 95

항해 사전준비 4일차 - React

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

Sparta/항해99 2022.05.02

항해 사전준비 3일차 - 토이프로젝트 1 - 날씨를 알려줘!

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: 도시이름..

Sparta/항해99 2022.05.02

항해 사전준비 2일차 - 종합반2~5주차,토이프로젝트 기획, React, Redux

사전준비 2일차 기초 문법이 준비가 됬으니 실전을 경험할 차례지만, 곧 입학시험이 있으니 오늘 공부할 내용은 1. 웹개발 종합반 2~5주차 2. 토이프로젝트 기획 입학시험 대비여서 html, css, js, jquery, ajax, python-flask 로 구현해야한다. 3. 생활코딩의 React (function) - https://opentutorials.org/course/4900 까지만 하려고 한다. 종합반은 한번 수강했던 내용이므로, 정해진 시간보다 빠르게 리캡이 가능할거 같고, 토이프로젝트 기획은 뭐.. 일단 기획만 하는거고, 아이디어는 대충 있으니까 flowchart 그리는 쪽으로 진행을 해보려고 한다. 생활코딩은 React 강의가 2개인데, class를 이용해서 만드는 강의와 functi..

Sparta/항해99 2022.04.30

항해 사전준비 1일차 - JS, Python, Ajax, 종합반1주차 정리

오늘은 드디어 사전준비 1일차다. Slack에 가입했고, 7기에 넣어달라고 댓글도 남겼다. 스파르타에서 시험이 있다고한다. 종합반 수업을 2번정도 마무리하고, 팀원을모아 토이프로젝트 하는걸 추천했다. 하지만 스파르타에서 추천하는 종합반2회 마무리보다 나는 더 많은것을 준비해 보고싶다. 팀원을 구해서 토이프로젝트를 진행할지, 혼자할지는 아직 고민중이다. 고민은 여기까지하고, 일단 공부계획과 공부를 시작해야겠다. 오늘 꼭 끝낼 공부는 스파르타에서 제공하는 인강중에서는 1. JavaScript 문법 뽀개기 - 약 2시간 반정도의 인강 2. 파이썬 문법 뽀개기 - 약 2시간정도의 인강 왜인지 모르게 둘다 '1주차' 라고 밖에 안되있다. 무료로는 1주차만 공개가 되는건지는 모르겠지만, 이정도가 입장조건이라고 생각..

Sparta/항해99 2022.04.29

항해99 사전준비 0일차

항해 99 7기를 신청했다. 목표는 프론트엔드 개발자이다. 사전준비 0일차, 이미 리액트를 주특기로 배우고, 프론트엔드 개발자가 되기로 한 지금, 나는 항해 전까지 무엇을 공부해야할지 정리해보았다. 사전준비동안 스파르타에서 인강 여러개를 제공받았고, 이 인강들을 우선순위로 공부를 해보려고 한다. - 스파르타 - 1. 웹개발 종합반 2. JavaScript 문법 뽀개기 3. 파이썬 문법 뽀개기 자바는 스킵하기로 했다. 나에게 있어서 자바스크립트와 리액트가 주특기가 될거기 때문에. 대신 백엔드쪽은 Django 혹은 Node.js로 흐름을 이해하는정도만 공부하려고 한다. 스파르타의 인강은 대부분 길이가 짧다. JS도 배열까지밖에 인강이없다, 클래스나 화살표함수등은 언급되지 않아보인다. 짧은만큼 설명이 더 간결..

Sparta/항해99 2022.04.29

Node.js - 02 - API & REST API

API - API는 애플리케이션끼리 연결해주는 매개체이자 약속 -키보드로 글자를 입력하면 키보드는 우리가 작성한 글자를 컴퓨터에 전달해주는 역할을 합니다. 우리가 키보드의 키를 누르는것이 API를 호출하는것으로 볼 수 있습니다. -어떤 연인은 서로 기분이 상할것 같으면 미리 “윙크”를 하기로 약속했습니다. 대화하다 갑자기 “윙크”를 본 상대방은 기분이 나쁜것을 알아채고 은근히 기분을 풀어주려 노력합니다. 이러한 약속 또한 API라고 볼 수 있습니다. 우리가 API를 작성한다는 의미는? -웹 어플리케이션(프론트엔드)에서 원하는 기능을 수행하는 URL과 인터페이스를 제공한다는 의미 REST는 “Representational State Transfer”의 줄임 말 -최대한 간단하게 설명하자면 URL, Head..

Node.js - 02 - 미들웨어 (express.js) & Routing

미들웨어 - 미들웨어를 통해 웹 서버의 요청/응답에 대해 공통적으로 관리가 가능 - 미들웨어는 서버에 부착된 기능. express.js 의 미들웨어 - urlencoded: form-urlencoded 라는 규격의 body 데이터를 손쉽게 코드에서 사용할 수 있게 도와주는 미들웨어에요! - json: JSON 이라는 규격의 body 데이터를 손쉽게 코드에서 사용할 수 있게 도와주는 미들웨어에요! ex) json 미들웨어가 없으면 우리 서버에서는 json을 사용할수없다. 미들웨어 작성하기 (express) app.use((req, res, next) => { // 필요한 코드 }); // 예제 app.use((req, res, next)=>{ console.log('미들웨어가 구현됬나?') next(); ..

Node.js - 02 - Express.js 세팅

명령어 npm init -y // package.json 설치 npm i express // express 패키지 설치 npm i // 만약 node_module을 지웠을때 재설치 node 파일이름.js // 파일 실행 ctrl + c // 서버종료 package-lock.json: 내가 설치할 패키지들의 버젼을 lock 한다. // get 이라는 http method로 "/"경로로 요청이 들어오면 실행. app.get("/",(req, res) => { res.send('hello world'); }) // 서버를 port로 켜겠다, 두번째 함수는 서버를 키고 실행할 함수 app.listen(port,() => { console.log('Server On'); })

Node.js - 01 - 생년월일을 입력받아 만 나이 계산하는 함수

생년월일을 입력받아 만 나이 계산하는 함수 //생년월일을 입력받아 만 나이 계산하는 함수 function getAge(dateOfBirth) { // 코드 작성 let today = new Date(); let birth = new Date(dateOfBirth); console.log(today) console.log(birth) let year = today.getFullYear() - birth.getFullYear(); let birthdayPassed = today.getMonth() - birth.getMonth() >= 0 && today.getDate() - birth.getDate() >= 0; console.log(birthdayPassed) if (birthdayPassed) { re..

Node.js 01 - 자바스크립트 정리

Node.js - 자바스크립트가 실행될 수 있게 도와주는 런타임 플랫폼 자바스크립트 → 언어 간단하게 말하면? 자바스크립트는 내 생각을 코드로 표현할 수 있게 도와주는 도구 Node.js → 런타임 플랫폼 간단하게 말하면? Node.js는 자바스크립트 코드를 브라우저가 아닌 곳에서도 실행할 수 있게 해주는 마법 상자 npm - Node Package Manager으로, 자바스크립트를 위한 패키지 관리자이다. 자바스크립트 런타임 환경의 Node.js의 그 Node가 맞다. npm은 세계 최대의 소프트웨어 창고로, 엄청난 수의 코드 패키지를 가지고있다. 이는 오픈소스 개발자들이 그들이 개발한 소프트웨어를 공유한다. nvm - Node Version Manager으로, Node 의 여러 버전을 사용할 때 유용..

728x90