개인 페이지의 모달 창 작성 부트 스트랩을 사용해서 모달창을 작성하기 부트스트랩 링크 : https://getbootstrap.com/ 부트 스트랩을 사용 하는 법을 두루뭉실하게만 알아서 대충 복사 붙여 넣기만 하면 되는거아니야? 라는 생각으로 시작했습니다. 모달 기능을 사용하기위해 사이드바쪽에 모달을 선택한 후 이 기능 사용해야지 하고 들어가보니 코드가 없었습니다.. 뭐지 싶어서 위 설명을 보니 .modal-dialog 에 .modal-dialog-scrollable을 추가 해야한다고 합니다. 코드는..? 하면서 위에부터 천천히 읽고 내려오니 그 위쪽에 있는 모달 창중에 하나를 선택해서 사용 하는 거였습니다. 당연한걸 자만하다가 놓친거였습니다. 그렇게 코드를 다 가져와서 클래스를 추가한후 버튼을 클릭하..
GitHub Pages GitHub Pages는 GitHub에서 제공하는 다른 사람들에게 인터넷으로 공유할 수 있는 서비스(정적 웹사이트 호스팅)입니다. 먼저 파이어 베이스에 데이터를 저장하는 과정이 끝났으면 깃허브에 올립니다. 깃허브에 올리면 저장소에 내가 업로드한 파일이 있습니다. 이제 저장소(repository)에서 Setting을 클릭합니다. 그러면 설정페이지가 나오는데 여기서 좌측의 general의 Pages를 클릭합니다. Pages로 들어가서 아래로 내려가다보면 Build and deployment부분이 있습니다. 그 부분의 branch를 None에서 Main으로 바꿔줍니다. 그후 save를 누르고 조금 기다렸다가 새로고침 하면 화면에 주소가 나타납니다. https://startcoriny.g..
파이어 베이스 구글이 개발한 모바일 및 웹 애플리케이션 개발 플랫폼입니다. 개발자들이 백엔드 인프라를 구축하거나 관리하는 복잡한 작업 없이 핵심 기능에 집중 할 수 있도록 도와주는 플랫폼입니다. 무료로 사용 가능한 사용량이 있는데 이 부분을 넘기지만 않으면 무료로 배포를 할 수가 있습니다. 즉, 서버개발 없이 제작이 가능하며, 백엔드 코드를 몰라도 웹 서비스를 출시 할수 있습니다. 클라이언트는 서버로 데이터를 전송하는코드(프론트엔드)만 작성하고 데이터 베이스에 저장하는 백엔드코드는 파이어베이스에서 작성을 합니다. 사용법 파이어베이스 접속 ( https://firebase.google.com/?hl=ko ) • 로그인을 합니다. • 콘솔로 이동하기를 누릅니다. • 프로젝트 만들기를 클합니다. • 프로젝트 ..
공부하면서 fetch기능을 사용하여 어떤식으로 작동하는지는 배웠지만 fetch가 뭐야? 라고 물어봤을 때 머릿속에 정리된게 없어서 이렇게 기록으로 남기게 되었습니다. fetch fetch 자체는 단순히 네트워크를 통해 데이터를 요청하고 응답을 처리하는 데 사용되는 JavaScript API입니다. 또한 Promise를 반환하여, 이를 통해 비동기적으로 네트워크 요청을 다룰 수 있습니다. 그럼 여기서 모르는게 두가지가 나왔습니다. Promise는 무엇이며 비동기적은 어떤 것이냐? 우선 비동기적부터 알아보자면 실행의 방법은 동기적과 비동기적 있습니다. 동기적(synchronous) 가장 직관적이 예로 로그인을 하고자 할 때 아이디와 비밀번호를 적은다음 로그인 버튼을 눌렀을 때 새로고침과 같이 페이지가 재로딩..
Visual Studio Code를 사용해서 커밋을 해보려고 합니다. 첫번째로 내가 원하는 위치의 폴더를 생성합니다. 폴더를 생성한후 Visual Studio Code(이하 vscode)로 와서 File → Open Folder를 클릭한후 생성한 위치의 폴더를 선택합니다. 선택을 하면 vscode의 EXPLORER에 해당 폴더의 파일 구조를 볼수가 있습니다. 폴더 안에는 당연히 아무런 파일도 만들지 않았기 때문에 아무것도 없습니다. 여기서 터미널을 실행합니다.(window기준 터미널 위쪽 아래 화살표 클릭후 gitbash로 변경해야합니다.) 실행을 하게 되면 해당 폴더의 경로가 뜨는데 여기서 git init명령어를 입력하여 깃 지역 저장소로 지정합니다. git init 새로운 Git 저장소(reposit..
※ 페이징 처리를 위해서 필요한 정보 • 현제 페이지 번호(page) • 이전과 다음으로 이동 가능한 링크의 표시여부(prev, next) • 화면에서 보여지는 페이지의 시작 번호와 끝번호(startPage, endPage) • 제일 끝번호(realEnd) 끝번호 (endPage) 현재 페이지의 번호를 알아야 하는 이유는 페이지의 시작 번호와 끝번호를 알아야 하기 때문입니다. 페이지가 5개씩 나눠 떨어진다고 할때 3페이지를 보고 있을 때의 화면의 보여지는 시작페이지와 끝페이지는 1, 5일 것이고 7페이지를 보고 있을 때의 화면의 보여지는 시작과 끝페이지는 6, 10일 것입니다. 이는 끝페이지만 구할수 있으면 첫페이지는 구하기 쉽기 때문에 끝페이지부터 구한다면 아래와 같은 공식으로 구할 수 있습니다. th..
이용자의 입장에서 바라봤을 때 내가 필요한 게시글이 페이지 번호2번과 3번사이에 있으면 그 쯤에서 찾으면 되는데 하염없이 쭉 늘어져 있으면 내가 필요한 글의 제목 작성자 내용등을 일일히 알고 있어야 하거나 게시글 하나하나 들어가보며 찾아야 합니다. 이용자의 입장에선 굉장히 불편하기도 하고 사용하기 싫어질수 있습니다. 또한 수많은 데이터를 한 페이지에서 보여주면, 처리 성능 면에서도 영향을 미칠 것입니다. 그렇기에 백앤드 웹개발에서 페이징은 필수 인것 같아 페이징을 공부하면서 정리할겸 기록을 남기기로 했습니다. 아래의 SQL쿼리문은 페이지당 10개의 게시물을 띄우고 2개의 페이지로 나누고 싶을때의 SQL쿼리문입니다. ※ 게시물을 기준으로 보통 최신글이 가장 위에 올라온다. 즉 가장 늦게 들어온 데이터가 가..
오라클 데이터 베이스 힌트란? SQL 쿼리 옵티마이저에게 원하는 실행 계획을 지시하는 주석 형태의 명령입니다 . 힌트는 주로 성능 최적화나 특별한 상황에서 사용되고 힌트를 사용할 때는 신중하게 검증하고 테스트해야 합니다. 쿼리의 SELECT, UPDATE, INSERT, DELETE 문에서 사용할 수 있습니다. 오라클 힌트는 /*+...... */ 이 형태로 사용해야하며 +가 있으면 오라클은 이 주석을 힌트로 인식하고 힌트의 내용을 처리하게 됩니다. SELECT문을 예시로 SELECT /*+ INDEX_DESC(table_name index_name) */ * FROM table_name; 하나 하나 뜯어보면 SELECT * FROM table_name 이 구문자체는 'table내에 있는 모든 정보를 나..