엘리스 AI트랙 25

[엘리스 AI트랙] 엘리스 3기 첫 개인 프로젝트 후기 ⭐️

더 이상 미루면 영영 못 쓸거같기 때문에 호다닥 쓰는 첫 개인플젝 후기ㅎㅅㅎ 3기 첫 개인프로젝트 발표가 이번주 일요일에 끝났다 시간이 넘모 빠른것,,,! 이번엔 프론트엔드: 직업심리검사 서비스 / 백엔드: 도서관 대출 서비스로 진행됐다 신청은 선착순 마감! 나는 백엔드를 살짝 많이 놓은 상태여서...^^ 백엔드로 밀려나면 진짜 난 끝이다 싶어서 3시 땡 하자마자 신청했다(약간 수강신청 느낌이 나서 대학생 된 기분이였음 ்́ꇴ ்̀ ) 근데 나중에 알고보니 백엔드가 먼저 마감됐다고 한다 ㅎㅎ 의외였다 다들 프론트를 선호하지 않으셨던건가🤔 아모튼 이번 프로젝트를 진행하면서 내가 제일 기대했던게 1. 오피스아워 2. 코드리뷰 였는데 나는 활용을 잘 못했다... 이게 좀 아쉬운 부분🥲🥲 오피스아워에서 모르는 ..

elice/🐰🏁 2021.11.30

[엘리스 AI트랙] 07-04 Flask 기초 2

1. 데이터베이스 데이터를 저장하는 공간 관계형 데이터베이스(RDB)와 NoSQL(Not Only SQL)로 나뉘어져 있음 관계형 데이터베이스(RDB) 키(key)와 값(value)들의 간단한 관계를 테이블화 시킨 데이터베이스 DML을 사용해서 데이터 간 결합, 제약조건 등의 설정을 통해 데이터를 추출할 수 있음 테이블 간의 데이터 관계를 설정할 수 있음 각 컬럼마다 데이터의 형태가 동일, 정형화된 데이터를 가짐 SQL 질의어(쿼리)를 사용 클라이언트와 서버 사이에서 일어나는 일 2. Flask와DB 연동하기 순서 1) SQL import 하기 2) 데이터베이스 연결하기 con = sqlite3.connect("database.db") 3) 데이터를 불러올 수 있는 cursor 객체 만들기 cur = ..

elice/토끼성장일지 2021.11.11 (1)

[엘리스 AI트랙] 06-04 SQL 2

1. 데이터 그룹 짓기 - GROUP BY SELECT user_id, COUNT(*) FROM rental GROUP BY user_id; # 그룹의 기준 컬럼 보통 limit, order by, group by가 SQL문의 맨 끝에 옴 2. 데이터 그룹(GROUP BY절)에 조건 적용하기 - HAVING # rental 테이블에서 user_id가 같은 2개 이상의 데이터가 몇 개 있는지 검색 SELECT user_id, COUNT(*) # GROUP BY의 기준 컬럼 및 검색할 컬럼 FROM rental GROUP BY user_id # 그룹의 기준 컬럼 HAVING COUNT(user_id) > 1; # 조건 3. 여러 테이블의 정보를 한번에 조회하기 - JOIN 1) INNER JOIN문의 기본 ..

[엘리스 AI트랙] 07-02-01 ~ 07-02-02 Flask 기초 1

1. Flask Framework란? 파이썬을 사용해서 웹 서버를 만들수 있게 도와주는 Web Framework 파이썬의 패키지 micro framework 기본적인 기능만 제공 Flask의 장점 나만의 서버를 쉽게 작성 가능 간단한 코드로 빠르게 실행 가능 원하는 기능을 유연하게 확장하기 편리함 2. Flask로 Web server 만들기 from flask import Flask app = Flask(__name__) @app.route("/") def home(): return "hello world!" if __name__ == "__main__": app.run() __name__은 파일이 다른 파일에서 실행됐는지, 아니면 직접 실행했는지 알게 해줌 app.route(url) 아래의 함수는 ur..

[엘리스 AI트랙] React Hook으로 상태관리 하기

1. useState 단순한 하나의 상태를 관리하기에 적합함 const [state, setState] = useState(initState | initFn) 리액트는 state가 바뀌면 state를 사용하는 컴포넌트를 리렌더함 useEffect와 함께, state에 반응하는 hook을 구축 패턴 상위 컴포넌트에서 state와 state 변경 함수를 정의 그 state나 변경 함수를 사용하는 컴포넌트까지 prop으로 내려줌 state가 변경되면 중간에 state를 넘기기만 하는 컴포넌트들도 모두 리렌더링됨 ➡️ 상태와 상태에 대한 변화가 단순하거나, 상대적으로 소규모 앱에서 사용하기에 적합 2. useRef 상태가 바뀌어도 리렌더링하지 않는 상태를 정의함 ➡️ 상태가 UI의 변경과 관계없을 때 사용 리..

[엘리스 AI트랙] 05-04 React UI

1. 리액트와 사용하기 좋은 Styling 도구 종류 1) CSS Module CSS 파일의 확장자를 .module.css 로 지정해서 사용 장점 단점 class, id 등에 random string을 달아주기 때문에 선택자가 겹치지 않음 스타일 충돌을 방지하고 코드를 격리하여 CSS 설계가 가능 스타일링을 일일히 직접 해야함 //App.jsx import styles from "./app.module.css" export default function App() { return ( Pink Hello world Normal Hello world ); } /* app.module.css */ h1 { font-size: 1.5rem; } .title { font-size: 2.5rem; color: pa..

[엘리스 AI트랙] 06-02-01 ~ 06-02-02 SQL 1

1. 데이터베이스 여러 사람이 공유해 사용할 목적으로 통합하여 관리되는 데이터의 모음 ex) Maria DB, Oracle DB 등 SQL: 데이터베이스에 접근, 조작하기 위한 표준 언어 Structured Query Language 1) 관계형 데이터베이스 / 비관계형 데이터베이스 관계형 데이터베이스: 하나 이상의 테이블로 이루어지며 서로 연결된 데이터를 가지고 있음 SQL을 통해 제어 가능 비관계형 데이터베이스: 데이터들간의 연결이 없음 2) 테이블의 구성 요소 ⬇️컬럼(Column, 열)⬇️ ⬇️컬럼⬇️ ⬇️컬럼⬇️ 레코드(Record)➡️ 사번 이름 성별 레코드➡️ 001 철수 남성 레코드➡️ 002 영희 여성 컬럼: 주제, 제목 레코드: 내용, 값 모든 테이블은 고유의 이름으로 구분 명령어 1)..

[엘리스 AI트랙] 엘리스 3기 5주차 후기 🏎

1. 내가 생각하는 엘리스에서 가장 귀여운 캐릭터: 거북이 열일하는 봇이라서 실강날이면 맨날 레이서님들~ QR 체크인 해주세요~ 체크아웃 해주세요~~ 하는게 넘모 귀엽다 난 강경토끼파지만 이렇게 귀여운 거북이는 못참지,,, 2. 스터디 후기 1) 블로그 글 꾸준히 쓰는 스터디: 정리 잘 하시는분들이 많아서 존경스러움,,,ㅠ 나도 벨로그로 시작할걸 좀 후회되지만 어차피 개인 정리용이니까 티스토리로 계속 가는걸로💨 최종 목표는 글 잘 다듬어서 깃허브 블로그에 하나씩 정리하기....!!!! 2) 알고리즘 스터디: 역시 다른 사람들이 쓴 코드 보는게 도움이 많이 되는거 같다...내일 첫 모임인데 호다닥 준비해야지 3) 하루 일과를 쓰는 스터디...까진 아니고 소모임 느낌?: 다른 사람들이 어떻게 시간을 쓰는지 ..

elice/🐰🏁 2021.10.23

[엘리스 AI트랙] 04-04-01 React 심화 1

1. 자바스크립트 비동기의 등장 초기 웹 환경에서는 서버에서 모든 데이터를 로드하여 페이지를 빌드했기 때문에 JS에서는 별도의 비동기 처리가 필요하지 않았음 AJAX(Asynchronous Javascript And XML) 기술의 등장으로 페이지 로드 없이 client-side에서 서버로 요청을 보내 데이터를 처리할 수 있게 됨 옛날옛날...에는 브라우저가 정보를 요청하면 서버는 해당 정보를 포함한 페이지 전체를 전달 ➡️ 브라우저는 서버로부터 받은 HTML을 새롭게 렌더링했다고 한다 😮‍💨 XMLHttpRequest라는 객체를 이용해 서버로 요청을 보낼 수 있게 됨 2. 자바스크립트는 single-threaded language 자바스크립트는 메인 스레드가 하나인 single-threaded 언어이기..

elice/토끼성장일지 2021.10.22 (2)

[엘리스 AI트랙] 리액트 라우터(React-Router)

Declarative Routing for React 공식 문서에서는 React Router를 Declarative Routing for React로 정의하고 있다 이게 머야,,,싶어서 검색한 끝에 잘 설명해주는 글 발견 (🙋‍♀️ 멋진 코드 예제들이 있어요!) https://stackoverflow.com/questions/33655534/difference-between-declarative-and-imperative-in-react-js Difference between declarative and imperative in React.js? Recently I've been studying a lot about the functionality and the ways to use the Faceboo..