musukie 님의 블로그

AWS 배포를 진행 중이다. 현재는 http로만 배포에 성공했으나, https로도 배포하기 위해서는 도메인을 구입해야 했다. 가비아 사이트를 통해 원하는 도메인을 구입했다. 원하는 도메인은 이미 사용 중이어서, 괜찮은 도메인 이름을 조원들과 투표를 통해 선발했다. 뒤에 .com이 붙느냐, .kr이 붙느냐, co.kr이 붙느냐 등 위에 붙는 내용에 따라서 비용이 천차만별이었다. 우리는 .com으로 도메인을 구입하기로도 결정했고, 투표를 통해 선발된 도메인을 구입했다.1년으로 계약해서 1년 동안 구입한 도메인을 사용할 수 있다.오늘은 리액트 프론트를 구현하다가 cursor 속성에 대해 배웠다. 내용을 정리해보자. cursor 속성은 사용자가 웹 페이지에서 마우스를 특정 요소 위에 올렸을 때 표시되는 커서의 ..

프론트 작업을 하다 보니 중앙 정렬하는 기능을 자주 사용하게 됐다. 가운데에 요소들을 배치하는 것이 깔끔하고 안정적인 느낌을 주었다. 중앙 정렬 기능들을 정리해보자.Flexbox로 중앙 정렬세로/가로 모두 중앙 정렬.container { display: flex; justify-content: center; /* 가로 중앙 정렬 */ align-items: center; /* 세로 중앙 정렬 */ height: 100vh; /* 화면 전체 높이 */}justify-content: center;는 가로 방향으로 중앙 정렬align-items: center;는 세로 방향으로 중앙 정렬단일 축에서만 중앙 정렬가로 중앙 정렬 : justify-content: center;세로 중앙 정렬 : align-i..

트러블 슈팅언제까지 포트 5432와 씨름해야 하는지 모르겠다. 매번 다른 방식으로 해결해야 했다. 아래 내용은 이번에 포트 5432와 다툰 내용이다. 결론은 Postgresql 서버를 시작해야 했다.문제 상황drf | django.db.utils.OperationalError: connection to server at "localhost" (::1), port 5432 failed: Connection refuseddrf | Is the server running on that host and accepting TCP/IP connections?drf | connection to server at "localhost" (127.0.0.1), port 543..

오늘의 트러블슈팅을 작성해보겠다.문제 상황drf | django.db.utils.OperationalError: connection to server at "localhost" (::1), port 5432 failed: Connection refuseddrf | Is the server running on that host and accepting TCP/IP connections?drf | connection to server at "localhost" (127.0.0.1), port 5432 failed: Connection refuseddrf | Is the server running on that host and accepting ..

리액트 함수 function 함수(){ console.log(1); } ... { 글제목[0] } 👍{ 글제목[0] } 👍{ 글제목[0] } {console.log(1) } }>👍위 3개의 코드는 다 동일한 역할을 한다. 함수를 이렇게 3가지 방법으로 사용할 수 있는 것이다.실습해보자.let [따봉, 따봉변경] = useState(0);{ 글제목[0] } {따봉변경(따봉+1)}}>👍{따봉}state 변경함수(예:따봉변경)는 state변경함수(새로운state)의 형태로 적어야 한다. 자바스크립트 문법이기 때문에 따봉변경(따봉=1)과 같이 등호를 사용하면 안 된다. onClick은 이벤트 핸들러라고 하는데, html 요소를 클릭했을 때 내가 원하는 자바스크립트같은 것을 실행할 수 있게 ..

Reactsrc 폴더의 App.jsx에 작성되는 내용이 웹사이트에 보일 내용이다. 리액트는 새로고침하지 않아도, 수정사항을 자동으로 업데이트하여 웹사이트로 보여준다. 리액트의 아주 큰 장점이라고 할 수 있다. 리액트는 SPA(single page application)로, 웹페이지, 즉 html 파일이 하나밖에 없다. 하나의 웹페이지에 내용만 바꿔주기 때문에 새로고침할 필요가 없다는 것이다. 리액트 전체 파일에 html 파일은 단 하나다. main.jsx는 index.html 파일과 App.jsx를 연결해주는 역할을 한다. 즉, html과 자바스크립트를 이어주는 것이다. App.jsx에서 원하는 작업을 해주면 된다. css를 적용하는 방법은 같다. 다만 class가 아닌 className으로 클래스 이름..

CSSCSS를 통해 HTML을 예쁘게 만들어줄 수 있다. CSS의 순서를 간단하게 살펴보면 아래와 같다.스타일을 만든다. 스타일 이름을 정해주고, 스타일 내용도 작성한다.HTML 태그를 선택한다. 이 스타일을 어디에 적용할 지 HTML 태그들 중에 선택한다.CSS 스타일을 HTML 태그에 입혀준다. 선택한 HTML 태그에 CSS를 입혀주는 것이다.스타일을 만드는 방법은 아래와 같다..text-red 는 스타일의 이름이고, {} 부분은 스타일을 정의하는 부분이다. 즉, 내가 정의하고 싶은 스타일을 모두 {} 안에 작성해주면 된다. {} 안의 내용은 정의한 스타일 내용이다. 위 캡쳐본을 해석하면, 이 스타일을 적용한 html 태그의 글자색을 빨간색으로 하겠다는 것이다. color 이외에도 background..