전체 글 썸네일형 리스트형 Svelte 기본 개발환경 세팅 (SvelteKit XX) Svelte랑 Sveltekit이랑은 다르다. React와 Nextjs 같은 개념으로 생각하면 되는데 Sveltekit은 Svelte를 더 간편하게 써 줄 수 있게 하는 프레임워크다. https://svelte.dev/ 공식사이트에 들어가면 떡 하니 이렇게 프로젝트 생성부터 실행하는 것 까지 간단하게 나와 있는데 엄밀히 말하면 이것은 Svelte 프로젝트 세팅이 아니라 Sveltekit 세팅이다. 나는 React -> Nextjs 순으로 개발했을 때 더 편하고 더 나아진 점을 느꼇었기 때문에 이번에도 먼저 Svelte -> Sveltekit 순으로 가고 싶어 유튜브에 Hollo Coding 이라는 유튜버 강사님의 영상을 보면서 글을 작성해나가려 한다. npm init vite ./ // 프로젝트를 설치할.. 더보기 Svelte 를 시작하면서 이번에 회사에서 새로운 프로젝트성 플랫폼을 하나 또 들어갈 예정인데 매번 react, nextjs 를 이용해서 만들어진 서비스들만 만지다 보니 새로운 프레임워크가 땡겼다. 회사 형이 이번에 한 번 'Svelte' 라는 게 있는데 그거 이용해서 해보라는 권유에 처음은 망설였지만 단 한장의 사진으로 마음이 굳었다. Svelte에 대해 공부좀 하려고 인프런에 무료 강의를 찾아서 듣던 와중에 이 Svelte, Vue, React 각각의 방식으로 동일한 기능을 구현하는 코드를 봤을 때 뭔가 내 것으로 만들고 싶다는 느낌이 확 왔었다. 단순히 저 사진 하나에서만 봐도 기존에 쓰던 React에서 4가지나 낫다고 볼 수 있다. * 높은 가독성 유지 ( 딱 봐도 깔끔하지 않나 ) * 개발 시간 단축 ( 딱 봐도 코드량이.. 더보기 워드프레스 테마/플러그인 설치시 팝업 FTP 관련 이슈 해결방법 워드프레스 서버 설정을 마치고 테마 혹은 플러그인을 설치하려고 하면 이런 화면이 뜨게 될 것이다. 이 화면이 안뜨게 하는 방법이 있는데 wp-config.php 파일에 define('FS_METHOD','direct'); 추가해주면 된다. 복사붙여 넣기를 했다면 ''을 한번 확인해보고 저장하길 바란다. 더보기 WordPress Plugin 설치시 Could not create directory라는 에러에 대한 손쉬운 해법 원인은 권한이다. 플러그인 설치 시 정확히 기억은 안나지만 ~~~/~~~/~~~/wp-content 디렉토리에 디렉토리를 생성할수 없어서 생기는 에런데 나중에 해결하고 나서 보니 플러그인을 설치 하면 wp-content 디렉토리 안에 plugins 라는 디렉토리가 생길텐데 단순히 plugins 디렉토리를 생성하지 못해서 일어나는 일이다. 나는 wp-content 디렉토리에 777 권한 부여하고 재시작하고 나니 정상적으로 플러그인 설치가 되었다. 더보기 워드프레스 고유주소 변경 후 페이지 생성/업데이트/접속 안됨 에러 해결 이번에 워드프레스로 ec2에 직접 웹서버 구축하고 db 연결하면서 초기 세팅을 다 해주고 있는데 SEO에 유리한 측면적인 면을 위해서라도 페이지의 URL 주소를 위 사진의 글 이름 처럼 설정해주는 것이 좋은데 그러기 위해서는 .htaccess 파일에 추가적인 코드를 만들어 줘야 하고 그 과정을 거치고 이상없이 고유주소 구조를 바꾸고 페이지를 새로 생성 하게 되면 wp-json 주소로 post 요청을 쏘고 404에러를 뱉을 것이다. apache 사용자면 /etc/apache2/sites-enabled/000-default.conf 파일에서 AllowOverride를 All로 바꿔주거나 httpd 사용중이면 /etc/httpd/conf/httpd.conf 파일에서 AllowOverride를 All로 바꿔주면.. 더보기 Nestjs Pipe란 Pipe란 -> @Injectable() 데코레이터로 주석이 달린 클래스 -> Data Transformation, Data Validation을 위해서 사용 -> 메소드가 호출되기 직전 ( 핸들러로 가기 전 ) 파이프를 삽입하고 파이프는 메소드(핸들러)로 향하는 인수를 수신하고 그에 대해 작동 클라이언트 -> 컨트롤러 @Get() 핸들러 -> Service. -> 컨트롤러 @Get() 핸들러 -> 클라이언트 // with Pipe 클라이언트 -> 파이프 -> 컨트롤러 @Get() 핸들러 -> Service. -> 컨트롤러 @Get() 핸들러 -> 클라이언트 Data Transformation ? -> 데이터를 원하는 형식으로 변환 -> 숫자를 받길 원하는데 문자열로 온다면 자동으로 숫자로 바꿔준다. E.. 더보기 Nestjs DTO (Data Transfer Object) DTO는 데이터가 네트워크를 통해 전송되는 방법을 정의하는 객체다. DB에서 데이터를 얻어 Service나 Controller 등으로 보낼 때 사용하는 객체를 말한다. Interface나 class를 이용해서 정의 할 수 있지만 NestJs 에서는 class를 사용하는 것을 추천하고 있다. -> TypeScript의 클래스는 JavaScript ES6 표준을 따르므로 컴파일된 JavaScript에서 실제 엔터티로 보존되는 반면에 인터페이스는 변환 중에 제거되기 때문에 Nest는 런타임에 인터페이스를 참조할 수 없다. DTO를 사용하는 이유? -> 데이터 유효성을 체크하는데 효율적이다. -> 유지보수 하는데 더욱 용이하다. - ex) 많은 서비스, 컨트롤러 파일 등에서 게시물 생성 관련 작업에서 descr.. 더보기 Nest.js 모듈 생성하기 (Controller, Service) 게시판을 만들기 위해 먼저 게시글 Board 모듈을 생성해보겠다. nest cli 를 이용해서 생성해줄 수 있다. // nest g module 모듈명 nest g module boards 자동으로 폴더 및 파일 생성을 해주고 루트 모듈에도 임포트 된 것을 확인 할 수 있다. 모듈 안에 들어갈 controller, service, entity 등을 추가해주면 되겠다. 지금은 하나하나 추가해주고 있지만 나중에 한번에 모듈파일부터 관련된 파일들도 한번에 생성하는 명령어도 알아보겠다. Controller 파일을 추가해주기 전에 Controller 가 하는 역할을 알아보면 들어오는 요청을 처리하고 클라이언트에 그 응답을 반환하는 역할을 한다. Controller 안에 Handler가 존재하는데 핸들러는 @Get.. 더보기 이전 1 2 3 4 5 ··· 24 다음
