개발자연습노트

DOCTYPE html>html lang="ko">head>    meta charset="UTF-8">    title>로그인title>    style>        body {            font-family: Arial, sans-serif;            text-align: center;            margin-top: 50px;        }        .form-container {            display: flex;            flex-direction: column;            align-items: center;            justify-content: center;        }        #login-form { ..

박스의 가로세로 정렬뿐 아니라 반응형일 경우 알아서 정렬을 딱!!!일단 부모클래스를 플렉스로 만듭니다..box-wrap { display:flex;}이걸 먼저 선언해줘야 나머지 속성들을 쓸수 있어요.그 속성으론 justify-content, align-items, flex-direction, flex-wrap​하나씩 알아봅시다.가장 기본적으로 그냥 코딩한 예를 들께요.html> head> title>TEST/title> style> html, body { margin:0; height:100% } .box-wrap { display:flex; height:100%; background:#ccc } .box { width:100px; height:100px; background:yellow; border..

h1> 반가워요! ㅎㄹㅇㅎㄹㅇㅎㅎ h1>      반가워요!          ㅎㄹㅇㅎㄹㅇㅎㅎ

1. https://console.cloud.google.com/ 들어가서 사진의 내용과 같이 입력.2. 좌측 사용자 인증정보 > + 사용자 인증정보만들기 > OAuth 클라이언트 ID 여기에 나오는 아이디 비번 메모메모!!  3. 위 검색창에 google people api 쳐서 사용하기   index.htmlDOCTYPE html>html lang="ko">head>    meta charset="UTF-8">    title>Google Login Exampletitle>head>body>    h1>구글 로그인 예제h1>    a href="https://accounts.google.com/o/oauth2/v2/auth?scope=email%20profile&access_type=online&in..

dd

moveweb-afe1b.web.app  API - 유튜브 ,tmbd, tunefind ,vibe*영화 ost api가 없어서 선택한 tunefind. (주소랑 데이터랑 연경 시키기)앞 페이지에서 표지를 클릭하면 영어로 등록된 네임이 로컬에 저장, 다음페이지에서 로컬에서 꺼내서, 리플레이스로 주소에 맞게 설정. 연동됨.onst updateTuneFindURL = (title) => {                const formattedTitle = title                    .toLowerCase()                    .replace(/[^a-z0-9]+/g, '-')                    .replace(/(^-|-$)/g, '');           ..

1. 큰틀 프로필 시각화(능력치) 프로젝트 게시판 ( 서버 몽고,이미지-연결) todolist 쇼핑몰(로그인, 끌어옴) 크롤링 https://github.com/hjw1191/jongwan/commits/main 메인페이지

유저가 글작성시 이미지를 업로드할 수 있게 만들어봅시다.업로드한 이미지를 하드디스크에 저장해놓고 필요할 때 보여주면 될텐데 클라우드에 올리다보면 하드디스크 사용이 어려울 수 있을 때가 있어서 AWS S3같은 파일저장용 클라우드 서비스 빌려서 거기 업로드해놓는게 좋습니다. 첫가입시 카드등록까지 마치면 S3는 무료로 5GB까지 1년 이용가능하니까AWS S3 사용해서 이미지 파일 올리는 법을 좀 알아봅시다. 실은 구글 클라우드가 약간 더 싼데 사람들이 AWS를 좋아해서 그거나 씁시다.      Access 키 발급 일단 AWS 사이트 들어가서 가입하고 카드등록까지 마칩시다. 이제 서버에서 AWS기능을 이용하고 싶으면서버파일에서 코드짤 때 Access key가 하나 필요합니다. 그거 발급하려면 AWS 사이트 상..

코드의 구조를 간단하게 하기 위해 공통 기능을 미들웨어로 추출하고, 각 기능을 모듈화할 수 있습니다. 아래는 개선된 버전으로, 공통 기능을 미들웨어로 분리하고 라우트 핸들러를 별도의 파일로 분리한 예입니다. 1. 환경 변수 설정 파일 (.env) DB_URL=mongodb+srv://hjw1191:zxc123@hjw1191.zaqklsn.mongodb.net/?retryWrites=true&w=majority&appName=hjw1191 PORT=8080 SESSION_SECRET=세션 암호화 비번~~2. 서버 설정 파일 (server.js)// server.js const express = require('express'); const app = express(); const session = requ..