본문 바로가기

project

(12)
[나만무] node Logging System [나만무] node Logging System 개복치 서버 문제를 해결하기 위해 Logging 시스템 도입.. 라이브러리 설치 $ npm install winston $ npm install winston-daily-rotate-file $ npm install app-root-path server/winston/logger.js import winston from 'winston'; import winstonDaily from 'winston-daily-rotate-file'; const logDir = 'logs'; // logs 디렉토리 하위에 로그 파일 저장 const { combine, timestamp, printf } = winston.format; // Define log format co..
[나만무] Next Auth, google social login 구현 [나만무] Next Auth, google social login 구현 기존 구현했던 react-google-login 라이브러리 이용한 google login은 캐시를 지워줘야 됐다. 됐다 안됐다..하는 기능은 사실상 안되는 기능이다! npm i uninstall react-google-login 그래서 여러 자료를 찾던 중 NextAuth가 있길래 바로 이용. 참고 자료 https://www.youtube.com/watch?v=6lCXM11Tgyg https://dantechblog.gatsbyjs.io/posts/next-auth/ Home | Dan DevLog Blog posted about development dantechblog.gatsbyjs.io pages/api/auth/[...nex..
[나만무] 검색 기능 [나만무] 검색 기능 Front 쿼리 전달 features/Dashboard/components/SearchBar.tsx import React, { useState, KeyboardEvent } from "react"; import { useRouter } from "next/router"; export default function SearchBar() { ... const [keywords, setKeywords] = useState(""); const onKeyPress = (e: KeyboardEvent) => { if (e.key == "Enter") { e.preventDefault(); router.push({ pathname: '/search', query: {search : keywor..
[나만무] Google Social 로그인 [나만무] Google Social 로그인 구글 드라이브를 연동해야 할 수 도 있어서 google oauth 선택! 시간적 여유가 된다면, 카카오 소셜 로그인도 추가할 듯하다. 일단, 구글만! 회원가입은 없고, 소셜로 로그인하면 얻을 수 있는 정보로 회원관리할 예정이다, 로그인 한 회원이 유저 테이블 정보에 있으면 바로 토근 발급. 그렇지 않으면, 유저테이블에 등록후, 토근 발급!! 우리 서비스 서버에서 발행한 토큰으로 세션관리할 예정이다. 그렇다면 구글 oauth access token은 어디다 쓸꺼냐? 구글 드라이브 접근할 때, 사용할 듯하다... 더 알아봐야 한다. 일단 우리 서비스 세션 관리가 우선! Oauth 란? 사용자는 서비스 별로 로그인 정보를 따로 관리해야 해 불편함 검증되지 않은 App..
[나만무] 로그인 - 로그아웃 [나만무] 로그인 - 로그아웃 React-Node-MySQL 연동 프로젝트 진행 순서 1. CRA 생성 2. server 폴더 생성 - db 연결, 서버 3. Proxy설정 - package.json 폴더 구조 Client Server 리액트를 익히면서 클라이언트 서버가 있다는 걸 처음 알았다. 3000번 포트로 이어져 있기 때문에 이걸 proxy를 통해 포트 전환 해줘야 한다. 터미널창을 분리해서 두개의 서버를 돌려야 한다. 폴더 진입 주의!! Run Client Run Server .env DANGEROUSLY_DISABLE_HOST_CHECK=true PORT = 8000 MYSQL_HOST = 127.0.0.1 MYSQL_USERNAME = root MYSQL_PASSWORD = [비번] MYSQ..
Flask Jinja template Flask Jinja template 🔖 Flask란? import flask 위와 같은 명령어로 설치하지만, 놀랍게도 라이브러리가 아니다. flask는 frame work다. 그렇다면, frame work란? 제작자가 의도한 대로 사용하지 않으면, 작동하지 않는다. 즉, 정해진 rule(폴더명, 변수명)을 지켜야 한다. 🔖 jinja란? python flask 패키지에 내장된 템플릿 엔진으로 개발자가 동적으로 변하는 웹 페이지를 쉽게 구현할 수 있도록 도와준다. DataBasehtml | | ----------- | | template Engine | | result Document 보통 app.py에서 render_template을 하면서 list(db)를 같이 보내주고 이를 해당 html에서는 ji..
정글 Week00 4조 프로젝트 개요 정글 Week00 4조 프로젝트 개요 ✏️ 주제 정글 SW 사관학교 운영진과 나의 궁합은 어떨까? 순수한 궁금증에서 기획! ✏️ 기능 로그인 나의 MBTI 수정 나와 정글 SW 사관학교 운영진과의 궁합 정도 비교 ✏️ 와이어 프레임 ✏️ DB User Table id password MBTI MBTI Table MBTI1 MBTI2 color MBTI1은 강사님 데이터 4개 MBTI2은 회원 데이터 16개 총 64개의 데이터베이스 회원의 MBTI와 정글 운영진의 MBTI 결과 4가지 find Color Table color comment ✏️ 역할분담 마이페이지 배준수 회원가입 정진교 로그인 변다슬 ✏️ 일정 23.02.27 주제 와이어프레임 CSS 공통요소 선정 23.02.28 각자 맡은 부분 구현 2..
4차, 미니 프로젝트 제출 및 회고 4차, 미니 프로젝트 제출 및 회고 2023.02.02 - [JavaScript] - 4차 미니프로젝트, 이커머스- 원하는 상품 장바구니에 담기 2023.02.02 - [JavaScript] - 4차 미니프로젝트, 이커머스- 원하는 상품 장바구니 수량수정 & 삭제 2023.02.06 - [JavaScript] - html input checkbox checked 확인방법 2023.02.06 - [JavaScript] - html 숫자 세 자리 수 콤마(,) 📌 SA 📌 ERD 📌 시연동영상 📌 git repo godee95/5zizo_teamproject: nbcamp 4th miniproject (github.com) GitHub - godee95/5zizo_teamproject: nbcamp 4th ..
project 관련 작업하기 좋은 사이트들 project 관련 작업하기 좋은 사이트들 📌 Frame Work Excalidraw Excalidraw — Collaborative whiteboarding made easy Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them. excalidraw.com Pixso 홈페이지-스케치, 피그마 대신 차세대 UI 디자인 툴, 온라인 실시간 협업 지원 Pixso 홈페이지-스케치, 피그마 대신 차세대 UI 디자인 툴, 온라인 실시간 협업 지원 지능형 구성 요소를 통한 프로토타이핑 Pixso 구성 요소 라이브러리는 그 어느 때보다도 쉽게 프..
내일배움캠프 4기_Mini Project 3차 발표 40일차 TIL 내일배움캠프 4기_Mini Project 3차 발표 40일차 TIL 2023.01.06 - [JavaScript] - EJS공부 & 팀원 코드 이해하기1 2023.01.06 - [JavaScript] - EJS공부 & 팀원 코드 이해하기2 2023.01.06 - [JavaScript] - 회원가입 데이터 정규식 unit Test 느낀점 이번 프로젝트는 딱 내가 맡은 부분을 한 느낌? 로직 짜는게 어려워서 도움도 받았다. 애자일 방법론처럼 파트를 나누고 서로 소통을 원할하게 하니 모든게 수월하게 흘러간 느낌. 3번째 프로젝트라 그런가? 다들 뭘 해야하는지 아는 느낌이랄까? 온라인 협업에 익숙해졌다. 공유 사이트를 이용해 같이 발표자료도 만들고 api도 만들고 er다이어그램도 만들고! 이번에는 내가 짠 코드..