방뚝딱 학습노트
-
코딩이 쉽도록 도와주는 사이트방뚝딱 학습노트 2023. 8. 5. 00:17
I 클라우드 기반 통합 개발환경 서비스 구름 IDE (https://www.goorm.io/) : 개인 PC에 설치할 필요 없이 Docker 컨테이너 기반으로 다양한 SW 프로그램을 개발할 수 있는 '온라인 코딩 테스트 서비스'를 제공 (파이썬 프로그래밍 환경구축하기, 웹투앱 개발 환경 구축하기 등) I 웹 페이지 프레임워크 Bootstrap (https://getbootstrap.com/) : 웹사이트를 쉽게 만들 수 있게 도와주는 HTML, CSS, JS 프레임워크. 반응형 CSS를 통해 스마트폰, 태블릿, 데스크톱까지 다양한 기기에서 웹페이지가 안 깨지고 보이도록 도와주는 도구. Materialize (https://materializecss.com/) : 반응형 CSS 프레임워크. 모던한 디자인을..
-
Font 모음, 디자인 참고자료방뚝딱 학습노트 2023. 8. 5. 00:14
👍 폰트 사이트(상업적이용 범위 한번 더 확인하세요!) 폰트 라이선스 공식사이트 상업적 이용 범위 비고 나눔고딕, 명조 네이버 https://hangeul.naver.com/ 모두가능 무료 나눔바른고딕 나눔바른펜 나눔손글씨 붓, 펜 나눔스퀘어 나눔스퀘어 라운드 대한 윤디자인 http://www.19192019.com 모두가능 무료 민국 독립 만세 배달의민족 주아 우아한형제들 https://www.woowahan.com/#/fonts 모두가능 무료 배달의민족 도현 비비트리 고딕 비비트리 https://kr.123rf.com/krfreefont/ 모두가능 무료 비비트리 손글씨 비비트리 나무 하르방 제주감귤 123RF 오픈애즈 스웨거 스웨거 http://swagger.kr/font.html 모두가능 무료 아리..
-
Js / Jquery 특징방뚝딱 학습노트 2023. 8. 5. 00:06
자바스크립트 특징 오래됐고, 발전이 빠름 인터프리터 언어 (순차적으로 소스를 해독해나감) 해독을 알아서해줌 (java 같은 언어는 컴파일이라고 하여 별도로 해독을 시켜줘야함) 자바스크립트 소스 드럽고 길어서 jquery로 사람들이 많이 씀 jquery 특징 편함 소스짧음 (그만큼 함축되어있는 의미가 많음) $(선택자) 로 뭔가를 부름 하다보면 암 script 선언 위치는 헤더에 작성하라 하지만 딱히 권고사항아님.. 요즘엔 하단에 작성하기도 함 자바스크립트 기초 변수선언 3가지 (var, let, const) 변수는 컴퓨터한테 내가 {변수명}에 어떤 {값}을 넣어줄 거야 라고 알려주는거 (마치 애키우는거랑 똑같음 안 알려주면 못 알아먹음...) 세미콜론 마지막에 빼먹으면 반성해주세여 **{변수명}**은 본..
-
CSS 용어 모음방뚝딱 학습노트 2023. 8. 4. 23:54
#UNIT(CSS의 단위) 1. Absolute length (절대값) 예) px, cm, ... 2. Relative length (상대값) 예) rem, em, %, vh, vw, ... -rem을 기본으로 많이 쓴다 단어 줄바꿈으로 변경 word-break: break-all; relative 부모 element를 기준으로 위치한다 부모 : position: relative [기준점 잡기] position: absolute; [그 안에서 움직이기] translate(x,y) item이 원래 위치를 기준으로 이동한다 transform:translate(25px, 50px) X축을 기점으로 이동 transform:translateX(25px); y축을 기점으로 이동 transform:translateY..
-
POSTMAN 설치방뚝딱 학습노트 2022. 12. 19. 00:18
API 서버를 테스트하는 프로그램 https://www.postman.com/downloads/ Download Postman | Get Started for Free Try Postman for free! Join 20 million developers who rely on Postman, the collaboration platform for API development. Create better APIs—faster. www.postman.com 회원가입 후 포스트맨 다크모드 설정 설정 > Settings > Themes > Dark모드 선택 Workspaces > My Workspace API를 테스트 하는곳 요청 할 탭 열기 localhost:3000 입력 후 > 위 그림과 같이 나올 시 접속 ..
-
JWT방식으로 Auth(Authorization, 인증)방뚝딱 학습노트 2022. 12. 18. 23:25
JWT(json web token)의 약자이다 json 포맷 토큰 / json : 자바스크립트 오브젝트를 문자열 형태로 작성한것 로그인에 성공할 경우 서버가 발급한다 유저는 매 요청시에 서버에 토큰을 함께 전송한다 매 요청시 토큰을 보내는 이유 http 무상태성 passport 러이브러를 사용 / 예) 여권을 보여주고 입장하는 형태 서버 작동할 시 해당경로로 /social-media-app/server/ 서버 켜기 npm run devstart 에러가 발생할 경우 오타일 확률이 높습니다. .env 데이터베이스 연결 주소 변경시 해결되는 경우도 있습니다. 문자로 작성시 오류나는 경우 아래 그림과 같이 127.0.0.1 로 변경하시기 바랍니다. 환경변수를 수정하면 서버를 재부팅해야 적용이 됩니다 서버 켜기 ..
-
[Backend]Application SERVER 파일과 디렉터리 알고가기방뚝딱 학습노트 2022. 12. 18. 22:40
# MERN Stack M (MongoDB): 데이터베이스 E (Express): 서버 프레임워크 R (React): 프론트엔드 프레임워크 N (NodeJS): 서버 개발언어 # MVC패턴 모델(데이터구조)-뷰(UI를 정의)-컨트롤러(로직처리) / Model-view-controller 소프트웨어 공학에서 사용되는 소프트웨어 디자인 패턴 # 파일과 디렉터리 - index.js Entry point (애플리케이션의 시작점) - package.json 애플리케이션의 정보들 - .env (enviroment variables) 환경변수(애플리케이션에서 전체적으로 사용되는 변수)를 저장하는 파일 - routes/ 라우트 처리를 하는 파일들을 보관한다 라우트: 요청받은 url을 컨트롤러(로직처리)에 연결하는 역할..
-
'formidable'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다.방뚝딱 학습노트 2022. 12. 18. 20:11
설치하는 진행 # 현재 디렉터리를 nodejs 프로젝트 디렉터리로 만든다 social-media-app/server npm init # 필요한 package 설치 npm install cookie-parser cors dotenv express formidable jsonwebtoken mongoose passport passport-jwt - 한 줄씩 따로 작성해서 설치하거나 한꺼번에 적어서 설치해도 무방하다 설치 시 오류 'formidable'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다. 위의 오류는 터미널에서 node등 프로그램을 사용시에 발생할 수 있다. 이미 설치를 완료했다면 해당 프로그램을 환경변수에 등록해주면 해결된다. window10기준 제어판 > 시..