우당탕탕 개발일지

날짜를 표기하는 여러 포맷들이 있다.YYYY-MM-DD 나, YYYY년 MM월 DD일  등등.. 이런 다양한 날짜 포맷을 Date 형식으로 변환하는 작업이 필요했다. 이때 알게 된 것이 dayjs이다. 프로젝트에 dayjs를 설치한다.npm install dayjs 커스텀 날짜 포맷을 적용하여 Date로 변환하기 import dayjs from 'dayjs';dayjs.extend(customParseFormat); //여러가지 커스텀 포맷을 지원하기 위해 확장//변환포맷을 커스텀으로 여러개 설정해놓는다.date_formats = [ 'YYYY년MM월DD일', 'YYYY년M월D일', 'YYYY/MM/DD', 'YYYY-MM-DD', 'YYYY.MM.DD hh:mm:ss', ..

준비사항 : github token 준비github를 이용하여 배포할 예정이다. 기본적으로 git 에 로그인할때 빔리번호가 아니라 패스키를 사용해야 한다. 깃허브 프로필 > Settings > developer settings > personal access token 을 발급받고 token값을 잘 보관해두자 ubuntu 포트 열기브라우저 > 웹 접속 포트는 80 이고 웹>서버API통신 포트는 3000 으로 잡았다. 통신을 하기 위해서는 ubuntu에서 포트를 열어주어야 한다.sudo ufw allow 3000sudo ufw allow 80sudo ufw reload 서버 ( nestJs ) 배포프로젝트가 ubuntu에 없을 경우 git clone 을 이용해 다운받는다. 그 뒤, 수정사항이 생길 경우 g..

구글에서 다음과 같은 경고가 발생해서, proguard를 활성화하려고 했더니이 App Bundle 유형과 연결된 가독화 파일이 없습니다.난독화된 코드(R8/proguard)를 사용하는 경우 가독화 파일을 업로드하면 비정상 종료 및 ANR을 더 쉽게 분석하고 디버그할 수 있습니다. R8/proguard를 사용하면 앱 크기를 줄이는 데 도움이 됩니다  1- ProjectSettings > Minify 에 Release 를 활성화한다. 여기까지 하고 빌드를 하니 위 에러가 발생했다. (원인)2- Build 란에 custom proguard File 을 활성화 한 뒤 proguard-user.text 에 다음과 같이 적어넣는다.-keep class com.google.android.gms.** { *; }-do..

JS에서의 깊은복사, 얕은 복사를 공부해보자 . 그 전에, 구조분해할당과 spread 연산자를 알아보자.구조분해할당구조화 되어있는 배열, 객체와 같은 데이터를 destructuring 시켜서 각각의 변수에 담는것을 의미한다. //배열의 구조분해 할당.let arr = [1,2]let[one,two] = arrconsole.log(one,two) // 1, 2//객체의 구조분해 할당.//key와 변수이름이 동일해야한다.let obj= {name:"otter", gender:"male"};let {name, gender} = obj;console.log(name, gender) // otter, male값을 단순히 복사해서 넣는것이기 때문에 원본 데이터에 영향을 주지 않는다.let arr = [1,2]let..

Unity 에서 제공하는 라이브러리인 ScreenCapture를 이용해 스크린샷을 찍고, 이를 저장하는 기능을 만들어보자. ScreenCapture의 공식 문서는 아래에 있다.https://docs.unity3d.com/ScriptReference/ScreenCapture.CaptureScreenshot.html Unity - Scripting API: ScreenCapture.CaptureScreenshotIf the screenshot exists already, ScreenCapture.CaptureScreenshot overwrites it with a new screenshot. Add .png to the end of filename to save the screenshot as a .png ..

!section 1.FreeCamp 강의노트프론트앤드와 백앤드의 이해프론트앤드웹 : HTML, CSS, JavaScript , Angular, Vue, React앱 : 코틀린(android) ,swift(ios), React native (cross) , 플러터 (cross)인터넷 브라우저 : html, css 로 작성된 파일을 유저가 보기 편하게 로드하는 역할을 한다.반응형 브라우저 : 유저의 해상도에 따라 UI구성이 달라지게끔 만들어진 브라우저.HTMLhtml 은Hyper Text Markup Language의 약자로,웹페이지에서 문서를 작성,조회,공유하기 위해 만들어진 체계이다.인터넷 브라우저는 이 html을 그려주는 도구이다.구역을 나누는 태그. block element로, 가로 전체를 차지한다...

추가))react-beautiful-dnd 로 구현을 끝냈을 때 계속 아래와 같은 warning이 나타났다. 실행하는데는 문제 없지만, 난 빨간색 로그를 굉장히 싫어하므로 없애고싶다. 이유를 검색해보니 현재 react-beautiful-dnd는  react-redux의 오래된 버전을 사용하고 있다고 한다. 그런데 beautiful-dnd 에서는 더이상 라이브러리를 업데이트하지않는다고.. 하기 때문에.. 다른 라이브러리로 바꾸는것이 좋겠다.. 사용할 것은 @hello-pangea/dnd 이다. 모든 동작은 beautiful-dnd와 동일하다 . 내용은 아래쪽에 수정해놓았다.  트렐로에서 사용하기만 했지 어떻게 만들지 생각조차 해보지 못했던... 드래그앤드롭을 구현해보도록 하겠다.  공식문서는 여기.. 이미..

공식문서https://tailwindcss.com/docs/installation Installation - Tailwind CSSThe simplest and fastest way to get up and running with Tailwind CSS from scratch is with the Tailwind CLI tool.tailwindcss.com  1. VSCode 에서 TailWindCSS IntelliSense 설치2. 프로젝트에 TailWindCSS 다운로드 및 init## 3가지 모듈 다운로드. -D 옵션은 개발에서 사용한다는 의미. -developmentnpm install -D tailwindcss npx tailwindcss init 3. tailwind.config.js 작성현..