티스토리

코딩뚠뚠

검색하기

블로그 홈

코딩뚠뚠

dbstndi6316.tistory.com/m

로디네로 님의 블로그입니다.

구독자: 32

방명록 방문하기

주요 글 목록

[AWS] Lambda에서 사용자 지정 ARN 사용 방법 문제 정의 :최근 Lambda를 이용중 boto와 pandas를 같이 쓰기 위해 계층을 추가하는 중 문제가 생겼다. 아래와 같이 계층에서 [Add a layer] 시다음과 같은 에러가 보인다 (사이즈 초과)Layers consume more than the available size of 262144000 bytes 문제 해결 : A. 이전에 내가 시도한 한 방법 :- AWS계층 : AWSSDKPandas-Python310- 사용자 지정 계층 : boto3 만 따로 패키징해서 업로드 한 레이어 B. 해결방법 : - 사용자 지정 ARN을 이용하여 직접 파일을 만들지 않고 이용 (!!간편!!)- 사용자 지정 ARN : Pandas - 사용자 지정 계층 : boto3 만 따로 패키징해서 업로드 한 레이어 C.. 공감수 0 댓글수 0 2024. 12. 31.
[AWS] Lambda@Edge 이용한 리디렉션 본 포스팅은 아래 포스팅에서 이어집니다. [AWS] 서브도메인 구축/운영하기서론 : 웹 개발시 개발/검증/배포 서버를 따로 두어야 된다는 말을 들어보았을 것이다.혹시 있을 수 있는 에러를 정규 배포 전 개발/검증 간 파악하고 수정하기 위해서이다. AWS S3를 이용한정dbstndi6316.tistory.com 문제 정의 : 아래 구성으로 정적웹사이트를 호스팅 운영하고 있는중 문제가 발생함.-> 주소창에 data101.io 입력 시 https://www.data101.io 로 접속 O-> 주소창에 http://data101.io 입력 시 https://www.data101.io 로 접속 O-> 주소창에 https://data101.io 입력 시 https://www.data101.io 가 아닌 http.. 공감수 0 댓글수 0 2024. 7. 10.
[AWS] 서브도메인 구축/운영하기 서론 : 웹 개발시 개발/검증/배포 서버를 따로 두어야 된다는 말을 들어보았을 것이다.혹시 있을 수 있는 에러를 정규 배포 전 개발/검증 간 파악하고 수정하기 위해서이다. AWS S3를 이용한정적 웹페이지 배포시에도 스토리지와 도메인을 다르게 두어 배포 서버를 다르게 하는 효과를 낼 수 있다. 예를들면 아래와 같이 말이다.- 메인도메인 : https://abc.com - 사용자도메인 : https://www.abc.com- 개발도메인 : https://dev.abc.com 기술 스택 : - React- AWS S3- AWS Route53- AWS Cloudfront- AWS Certificate Manager 방법 : 1. S3 버킷을 생성한다.- 버킷이름은 서브도메인 이름이여야 된다. (www.a.. 공감수 0 댓글수 0 2024. 6. 26.
[AWS] AWS 계정 해킹 당한 후기 (진행중) 데이터분석 플랫폼 출시를 목표로 달리고 있던 중 AWS에서 심상치 않은 메일이 도착했다. AWS에서 수시로 광고메일, 안내메일이 오는지라 대수롭지 않게 넘기지만, 이번엔 달랐다. 1. Your AWS Abuse Report 귀하의 AWS 남용 보고서 > 현재 크롤링 서비스를 개발중에 있었기 때문에, 그것과 관련된건가 싶었다.> 하지만 나는 EC2를 사용하지 않는데 EC2에 이상이 있다 해서 이상했던 첫 메일 2. AWS 확인> 엄청나게 많은 인스턴스들이 생성되어 있었다.> 실시간으로 비용이 나가는 상황이여서 즉각 조치가 필요한 상황. 모두 종료 > IAM 확인시 만들지 않은 사용자 이름이 존재했다. 삭제 3. 1차 조치너무나도 허술하게 AWS 를 사용했다. 즉시 아래와 같은 조치를 취했다.> 모든.. 공감수 1 댓글수 0 2024. 6. 23.
[AWS] 노코드 Data 분석 서비스 개발&런칭 서론 : 텍스트 데이터는 현대 사회에서 지속적으로 증가하고 있으며, 이를 효과적으로 분석하는 것은 기업부터 연구소, 개인까지 다양한 분야에서 점점더 중요한 과제로 자리잡고 있다. 텍스트 데이터 분석을 통해서 우리는 소비자 피드백, 소셜 미디어 등의 다양한 정보에서 인사이트를 얻을 수 있다. 매체얻을 수 있는 데이터데이터 분석 후 인사이트모바일앱평점, 댓글, 버그리포트, 소셜피드백- 사용자 경험 개선- 버그 및 문제점 식별- 기능 개발방향 설정- 마케팅 및 사용자 참여유튜브영상설명, 댓글, 제목, 태그- 콘텐츠 종류의 인기 분석- 시청자 참여도 및 반응- 타켓 분석 - SEO 최적화- 마케팅 및 광고 전략온라인 몰 (쿠팡)리뷰, 제품설명 , Q&A, 피드백, 문의사항- 고객 만족도 및 제품 품질- 트렌드 .. 공감수 1 댓글수 0 2024. 6. 22.
리액트 프로젝트 검색 상위노출 시키기 SPA-SEO 서론 누구든 내 홈페이지를 검색결과 상단에 띄워서 많은사람들에게 노출하고 싶어한다. 우리나라에선 구글과 네이버 검색비중이 높기때문에 두 검색엔진을 중점적으로 작업한다. 이 글에서는 SPA(Single Page Application)의 기본적인 SEO( Search Engine Optimizer / 검색엔진 최적화) 를 알아본다. 구글의 검색엔진 알고리즘은 다음 순서로 작동한다. 1. 크롤링 - 내 웹페이지의 콘텐츠 정보들을 모두 수집하여 가져온다. 2. 인덱싱 - 구글 봇이 수집한 정보들을 색인해서 데이터로 보관한다. 3. 랭킹 - 콘텐츠를 검색의도에 맞춰 순위를 부여한 다음 랭킹 순서대로 결과를 출력한다. 구글을 랭킹 산정에 약 200가지 이상의 측정 기준이 있다고 발표하였고 밝혀진 내용은 다음과 같다.. 공감수 1 댓글수 0 2024. 3. 8.
[AWS] ChatGPT API 이용 꿈풀이 런칭 서론 ChatGPT의 출시 이후 너무나도 많은 유용한 서비스들이 런칭됐다. PDF요약, 번역 을 포함해 생산성을 향상시켜주는 여러가지 툴들이 사용되고 있다. 생성형AI의 발전은 대화형에서 그치지 않고 음성합성, 이미지생성, 영상생성 등 여러 분야로 뻗어가고 있다. 테스트 링크 https://dreambook.click/ 무료 꿈해몽 - 생각나는대로 모두 입력 생각나는대로 모두 입력하면 상세한 꿈해몽을 무료로 제공합니다! dreambook.click 기획 이전 ChatGPT 이용한 프로젝트에서는 API 사용법과 프롬프트 엔지니어링을 주로 다뤘다. 이번에는 아래 내용을 중점으로 뒀다. 1. SPA의 SEO 방법 2. 프롬프트 엔지니어링 3. 장기적으로 유지할 수 있는 서비스 기술 및 Issue 해결 주요 기.. 공감수 0 댓글수 0 2024. 3. 6.
[Git] GitHub's file size limit of 100.00 MB 에러 해결 GitHub's file size limit of 100.00 MB 에러 귀찮은 에러해결 방법을 정리해놓으려고 오랜만에 포스팅을 한다. 에러 메시지는 아래와 같다. remote: error: File test.mp4 is 100.1 MB; this exceeds GitHub's file size limit of 100.00 MB remote: error: GH001: Large files detected. You may want to try Git Large File Storage - https://git-lfs.github.com. Github에 저장되는 최대 파일크기는 100MB 인듯한데 내 파일(test.mp4)의 크기가 무려 100.1MB 여서 push에 실패한 것이다! 용량이 0.1MB만 작았더.. 공감수 2 댓글수 1 2023. 12. 1.
[기타] 메일서버 및 웹호스팅 위한 네임서버 설정 개요 각 회사에서는 당연히도 하나의 도메인으로 홈페이지와 메일 두가지 서비스를 모두 이용한다. ex) www.samsung.com Google Domains 에.. 공감수 0 댓글수 0 2023. 5. 22.
[AWS] ChatGPT API 이용 전생테스트 런칭 Chat GPT의 인기가 몇개월이 지나도 식지 않는다. 수많은 서비스들이 런칭되고있고 이들은 때론 실생활에 매우 유용하다. 유행에 뒤쳐지지 않게 API를 이용해보고 인사이트를 얻고자 프로젝트를 시작했다. 테스트 링크 ChatGPT 전생스토리 previouslife.click 홈 화면 채팅중 화면 분석결과 화면 기획 이전 프로젝트들에서는 빠른 출시와 매출을 기대했다면 이번 프로젝트에서는 아래와 같은 내용들을 중점으로 뒀다. 1. Chat GPT API 사용 인사이트 2. Chat GPT 프롬프트 엔지니어링 etc. - 개발자에게 제안하기기능- 채팅형 UI 개발 기술 스택React(js), python, AWS (lambda, DynamoDB, APIgateway, S3, CloudFront, Rou.. 공감수 2 댓글수 0 2023. 5. 2.
[기타] ChatGPT 란, 간단한 활용법과 한계 Chat GPT가 출시된지 벌써 몇 개월이 됐지만 아직도 업계와 사회에 큰 화제가 되고있다. 몇몇, 아니 이 글을 읽고있다면 한번쯤은 Chat GPT를 사용해봤을것이라고 생각한다. 이 글에서는 아래와 같은 목차로 Chat GPT에 대해 풀이해보려 한다. 1. 소개 2. 작동원리 3. 활용분야 4. 사용법 5. 한계점 1. 소개 Chat GPT는 OpenAI가 개발한 GPT-3.5 엔진 기반의 인공지능 챗봇이다. - GPT 엔진 : Generative Pre-trained Transformer 로 자연어 처리를 위한 인공지능 모델문장에서 단어들간의 관계를 이해하고 출력문장을 생성할 수 있다. GPT-1 : 2018.6 GPT-2 : 2019.2 GPT-3 : 2020.6 GPT-3.5 : 2021.10 >.. 공감수 0 댓글수 0 2023. 3. 27.
[AWS] MZ오피스테스트 - 런칭 한달전쯤 막을 내린 SNL의 MZ오피스는 지난 겨울 꽤나 큰 인기를 끌었다. 나오는 게스트 마다 특징이 있고 그 개성을 다들 잘 살려 재밌게 본 기억이 있다. 기억을 되짚어 꼰대vsMZ 를 가려보는 테스트를 런칭해보았다. "MZ 오피스 테스트" 링크는 여기에 있다! MZ오피스 테스트 www.mzofficetest.click실행결과홈화면 질문화면 쿠팡광고 양해 결과화면 기획 흥행했던 컨텐츠를 다른 방법으로 즐기고픈 사람들이 있을수 있기에 기획해보았다. 연령층은 20대후반~40대 초 정도까지의 사회초년생~중년생을 대상으로 했다. 저번 프로젝트들을 되짚어보면 결과적으로 아래와 같은 기대/아쉬움 이 있었다. 카톡분석 왕 테스트 : 출력 결과 풍부 / 실행과정이 너무 복잡함재벌집 막내아들 테스트 : 드라마.. 공감수 1 댓글수 1 2023. 3. 6.
[기타] AI-900 시험 후기 목차 1. Microsoft Learn 2. AI900 3. 시험응시방법 4. 후기 및 팁 Microsoft Learn Microsoft는 Microsoft Learn을 통해 많은 학습 과정들과 인증을 제공한다. 그 중 AZ900을 저번에 취득했고 이번에는 AI900을 취득했다. 이 둘은 기본 과정으로, 그 다음과정들을 보려면 아래 사진의 Azure 의 Certification Path 사진을 참고하자 AI-900 그 중 Microsoft Azure AI Fundamentals : AI-900 시험 은, Microsoft Azure 의 AI 서비스와, AI에 대한 지식을 점검하는 시험이다. 시험 난이도는 기존에 AI에 대한 공부를 했던 사람이라면, Azure 의 서비스에 대해서만 짚으면 쉽게 통과할 정도.. 공감수 1 댓글수 0 2023. 2. 12.
[기타] AZ-900 시험 후기 목차 1. Microsoft Learn 2. AZ900 3. 시험응시방법 4. 후기 및 팁 5. 시험 응시 이유와 여러 생각들 Microsoft Learn Microsoft는 Microsoft Learn을 통해 많은 학습 과정들과 인증을 제공한다. 아래와 같이 많은 종류가 있고 난이도가 꽤 어려운 전문가 용도 존재한다. AZ-900 그 중 Microsoft Azure Fundamentals : AZ-900 시험 은 Microsoft Azure 기본 사항에 대한 지식을 점검하는 시험이다. 나는 출퇴근 시간에 틈틈히 덤프문제 풀이와 강의로 2주정도 공부를 해서 취득할수 있었다. 난이도가 어렵지 않아 누구든 쉽게 도전할 수 있다. 시험 범위는 아래와 같다. (사실 별 신경안쓰고 공부했다.) - Cloud 개념.. 공감수 1 댓글수 0 2023. 1. 29.
[AWS] 내 사이트 구글 서치콘솔 등록하기 AWS 의 Route53 으로 등록한 내 도메인의 검색 실적을 알고싶다면 어떻게 해야될까? 또는 내 블로그의 유입경로를 알고싶다면?? 네이버 애널리틱스와 구글 서치콘솔 과 같은 도구들이 존재한다. 그 중 구글 서치콘솔에 등록하는 과정을 포스팅하려 한다. Google Search Console Search Console 도구와 보고서를 사용하면 사이트의 검색 트래픽 및 실적을 측정하고, 문제를 해결하며, Google 검색결과에서 사이트가 돋보이게 할 수 있습니다. search.google.com 1. 어떤 정보들을 얻을 수 있나? - 총 노출 수 대비 클릭수 - 평균 CTR 및 게재순위 - 국가별 접근, 기기별 접근 등 사이트 유입 관리에 필요한 많은 정보들을 제공받을 수 있다. 2. 내 도메인을 구글 서.. 공감수 0 댓글수 1 2023. 1. 16.
[AWS] 재벌집 막내아들 테스트 - 런칭 재벌집 막내아들이 16부작을 마지막으로 마무리됐다.결말이 시원하진 않았지만 최고시청률 30%로 화제가 됐었다.이에, 드라마와 MBTI테스트를 합한 서비스를 빠르게 런칭하고자 했고,약 1주일간의 작업 끝에 서비스를 런칭할 수 있었다.아래 내용들을 정리해보고자 한다. 테스트 링크 재벌집 막내 테스트 advancer-rrs.click 기획항상 핫한 MBTI 테스트와 요즘 핫한 재벌집막내아들 드라마를 합하면 꽤나 트래픽이 나올것이라고 생각했다.어렵지 않은 주제로 테스트를 만들고 재밌는 문제와, 정확한 결과를 낸다면 공유가 잘 될것으로 생각.이에 광고를 통한 수익성 창출을 기획했다. 개발최우선 목표는 빠른 개발 및 검증 후 출시.MBTI 테스트의 폼은 널려있기에 Github 의 힘을 빌렸다. 기존 폼 + 컨텐츠.. 공감수 0 댓글수 0 2022. 12. 28.
[C/C++] boost libraries C++ 은 복잡하고 방대한 언어이다. STL 이라는 표준 라이브러리를 제공하지만 여전히 부족하다. 이를 보완하기 위한 라이브러리가 boost libraries 이다. libraries라는 이름에서부터 느낄 수 있듯 boost 자체도 매우 방대하고 또 사용하기 어렵다. 주로 무엇을 보완하기 위해서 사용할까? shared_ptr boost의 존재보다 더 유명한 클래스였지만 C++11에 std::shared_ptr이 포함되어 사용할 수 있다. C++11 환경을 사용하지 못한다면 대안으로 사용가능하다. ex) shared_ptr을 사용하여 자원관리를 한다. shared_ptr이 파괴될때 fclose가 호출되기 때문에 파일 포인터 자원이 자동적으로 소거된다. 생성시에만 파괴루틴을 등록 후 신경쓰지 않아도 되어 버.. 공감수 0 댓글수 0 2022. 12. 11.
[OS공부] 뮤텍스/세마포어/크리티컬섹션 개념 세 기법은 운영체제가 지원하는 동기화 객체의 종류이다. OS에 쓰레드 동기화가 왜 필요할까? 컴퓨터에서의 자원은 제한되는 특성을 갖지만 시스템은 여러 프로세스를 동시에 실행하면서 각각 프로세스들은 자원들을 차지,점유하려는 시도를 한다. 이를 관리할 시스템이 없다면 프로세스간 충돌이 빈번할 것이다. 이 포스팅의 내용은 이런 문제를 해결하기 위해 운영체제에 도입된 객체를 활용하는 방법이다. 운영체제가 제공하는 동기화용 커널객체에는 뮤텍스,세마포어,이벤트 등이 있으며, 사용자모드 동기화 객체로 크리티컬 섹션이 존재한다. 뮤텍스(Mutex) 기반의 동기화 (메모리 접근 동기화) 세마포어(Semaphore) 기반의 동기화 (메모리 접근 동기화) 크리티컬 섹션(Critical section) 기반의 동기화 1. 뮤.. 공감수 0 댓글수 0 2022. 11. 17.
message queue 란 message queue는 IPC 방법중 하나이다 - IPC : Inter process communication 으로 프로세스 간 통신을 말한다. 종류는 아래와 같다. file pipe message queue shared memory signal socket 이 중 이번에는 message queue를 공부해보려한다. message queue 말 그대로 queue를 사용해 메시지를 주고받는다. queue의 특징인 FIFO 방식 그대로이지만, 타입에 따라 특정 메시지를 먼저 수신할 수도 있다. 특징 : 비동기적으로 전송하여 효율적이다 queue가 어딘가에 저장되어있어 버퍼의 역할을 한다. 그 어딘가는 kernel level단이고, 프로세스가 종료되어도 남아있다. 구현 : 헤더 : #include #inc.. 공감수 2 댓글수 0 2022. 10. 10.
git diff 정리하기 요즘 세상에 git 명령어를 직접 쓰는 개발자들이 얼마나 있을까 하지만 나처럼 필요한 사람이 있을 수 있기때문에 정리해보려 한다. 여러가지가 있지만 이번엔 가끔쓰는듯 꽤나 자주 쓰는 'git diff' 이다. git diff란 diff = difference 무언가의 차이를 보여준다 여기서는 commit branch 간 다른점 또는 Repository Directory 간 다른 점을 보여주는 명령어이다. 따라서 다양한 옵션들이 있는데 하나씩 간단히 알아보도록 하자. 1. git diff - Working Directory 와 Staging Area 사이의 차이를 확인하기 위함 실제로 파일에 두 부분을 수정 후 git diff 를 실행해보자 - git add를 하기전에 두 장소 (Staging Area 와.. 공감수 0 댓글수 0 2022. 10. 9.
[C/C++] ->(화살표) 와 .(도트) 이 둘은 클래스나 구조체에서 변수를 사용할때 이용하는 연산자이다. 즉 무언가에 접근 이라는 의미로 사용된다. 요약 1. .(도트) 는 클래스의 멤버를 직접적으로 접근한다. 2. ->(화살표) 는 포인터를 통해 멤버를 간접적으로 접근한다. 3. 즉 a->b 는 (*a).b 와 동일하다. 예시 - 아래 예시를 통해 이해해보자 #include using namespace std; class Mycls { public: int age = 10; int num = 1000; const char* name = "홍길동"; }; struct Mystruct { int age = 20; int num = 2000; const char* name = "김김김"; }; void main() { Mystruct mystru.. 공감수 3 댓글수 1 2022. 10. 3.
[ML/DL] 정규화와 표준화 딥러닝을 공부하다보면 이 두 표현은 계속 볼 수 있는 개념이다. 우선 정규화라는 용어는 Normalization, Regularization 두 표현에 모두 사용하고 (Regularization은 '일반화' 라고 하는것이 이해에 편하다) 표준화는 Standardization에 사용한다. 그렇다면 정규화와 표준화가 아닌 Normalization / Regularization / Standardization 으로 나눠서 공부해보도록 하자 1. Normalization 데이터를 compact하게 만들기 위해 사용한다 -> 학습전 값의 범위를 축소한다 (0~255 >> 0~1) - Local Minima에 빠질 위험 감소 - scale이 큰 feature의 영향이 비대해지는 것을 방지 딥러닝에서 사용하는 Bat.. 공감수 0 댓글수 0 2022. 9. 27.
[ML/DL] Batch Normalization 배치정규화 과적합을 줄이는 방법 중 하나로 알고 이 글을 읽는 분들이 많을것이다. Batch Normalization에 대해 알아보도록 하자. 먼저 Batch Normalization 은 아래 논문에서 나온 개념이다. Batch Normalization: Accelerating Deep Network Training by Reducing Internal Covariate Shift Training Deep Neural Networks is complicated by the fact that the distribution of each layer's inputs changes during training, as the parameters of the previous layers change. This slows do.. 공감수 2 댓글수 2 2022. 9. 16.
Commitlint 커밋린트 란 개요 commitlint 를 이해하기 전에 알아야될것들을 우선 개요에서 설명하려 한다. 커밋 메세지 컨벤션 : 프로젝트를 깃으로 관리할땐 커밋메세지를 남기곤 한다. 협업을 위해서 커밋메세지의 통일성이 필요하고, 커밋 메세지 컨벤션은 이에 대한 규칙이다. 규칙들 : - 제목과 본문을 빈 행으로 구분 - 제목을 50글자 이내로 제한 - 제목의 첫 글자는 대문자로 작성 - 제목의 끝에는 마침표를 넣지 않는다 - 제목은 명령문으로 작성하며 과거형X - 본문의 각 행은 72글자 내로 제한한다 - 어떻게 보다는 무엇과 왜 를 설명한다 커밋 메세지 구조 : $ (): -- 헤더 -- 빈줄 -- 본문 -- 빈줄 -- 바닥글 githook : 프로그래밍에서 hook이란 특정 함수 전후에 호출이 되는 코드를 말한다 git.. 공감수 0 댓글수 0 2022. 9. 6.
colab에서 커스텀 폴더/패키지 import 방법 colab에서 프로젝트를 진행하면 한번쯤은 겪어봤을 수 있는 이슈이다. 상황 : 아래와 같은 코드에서 - torch 는 내가 만든 패키지가 아니다 pip로 설치가능 - LFW는 내가 만든 data폴더의 lfw.py 에 있는 class이다. import torch import torch.nn as nn from data.lfw import LFW from data.ms1m import get_train_loader ... 하지만 같은 위치에 있다고 해도 LFW를 바로 불러오지는 못한다. PC와 다르게 이와 같은 저장소의 문제가 있다. 해결 : 매우 간단하다. - google drive 와 연동시켜준후 - 위치를 현재위치로 이동시켜주면 된다. 1. drive 마운트 import os from google.c.. 공감수 0 댓글수 0 2022. 9. 4.
[AWS] 카톡분석 프로젝트-15 / React / 카톡 인앱 브라우저 전환 서비스 배포는 이미 완료했으며 개발간 자잘한 팁들을 포스팅한다. 카톡분석 서비스 주소 https://www.advancer-katalk.click 카톡분석 왕 테스트 www.advancer-katalk.click 개요 카톡으로 링크를 공유받았을때 그 링크는 카톡의 인앱 브라우저로 열리게 된다. 인앱브라우저의 경우 대부분 구동 간 제약이 존재한다 - 글자깨짐, 간격 등의 UI 이슈 - 여러 탭이 열리지 않는 이슈 등 이런 제약들을 우회하고자 페이지를 열었을 때 인앱브라우저이면 -> 크롬, 사파리로 브라우저를 자동전환하는 방법을 알아보고자 한다. 코드로 설명 - index.html 카카오톡이 아니더라도 인스타그램, 페이스북도 인앱 브라우저가 존재한다. 따라서 위 코드에서는 인스타인앱까지 탈출시켜봤다 끝 공감수 2 댓글수 2 2022. 8. 23.
[AWS] 카톡분석 프로젝트-14 / React / 카톡으로 공유하기 서비스 배포는 이미 완료했으며 개발간 자잘한 팁들을 포스팅한다. 카톡분석 서비스 주소 https://www.advancer-katalk.click 카톡분석 왕 테스트 www.advancer-katalk.click 아래와 같이 카톡으로 웹페이지를 공유하는 방법을 알아보자 1. 카카오 개발자 사이트에서 웹을 등록 Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 카카오 API를 사용하는 것이기 때문에 위 작업이 필요하다. 가입후 플랫폼 탭에서 아래와 같이 내 사이트를 적어넣어주자 (localhost는 개발용) 2. 코드내에 Kakao init 해주기 .. 공감수 1 댓글수 1 2022. 8. 22.
[AWS] 카톡분석 프로젝트-13 / React / 폰트 적용 서비스 배포는 이미 완료했으며 개발간 자잘한 팁들을 포스팅한다. 카톡분석 서비스 주소 카톡분석 왕 테스트 www.advancer-katalk.click 프런트엔드를 개발하면서 기본 폰트를 그대로 사용하는 경우는 없을것이다. 폰트를 적용하는 방법을 알아보자. 1. 폰트 다운로드 폰트는 많은 사이트에서 가져올 수 있겠지만 아래 링크에서 가져왔다. Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 눈누 상업용 무료한글폰트 사이트 noonnu.cc 원하는 폰트를 클릭한 뒤 Download 버튼을 눌러 다운받아준다. 2. 폰트 변환 다운로드한 ttf 파일들은 모든 브라우저에서 동작하지.. 공감수 0 댓글수 0 2022. 8. 21.
[AWS] 카톡분석 프로젝트-12 / CSS 배경 관련 속성 서비스 배포는 이미 완료했으며 개발간 자잘한 팁들을 포스팅한다. 카톡분석 서비스 주소 카톡분석 왕 테스트 www.advancer-katalk.click 프런트작업을 처음 해봤기때문에 처음 배경을 설정하는데 굉장히 애먹었던 기억이 있다 개발 초기 배경 화면 : 배포 시 배경 화면 : 어떻게 백그라운드를 완성할 수 있었는지 배경 속성을 정리해보도록 하자. 1. background-color 위 프로젝트처럼 background image 를 쓰면 관계없지만 color 속성을 통해 배경색상을 정할 수 있다. div{ background-color : black; } 2. background-image 배경을 이미지로 지정할때 사용하는 속성값이다. div{ background-image:url("https://~.. 공감수 0 댓글수 0 2022. 8. 6.
[AWS] 카톡분석 프로젝트-11 / React 이미지 슬라이드 구현 서비스 배포는 이미 했지만 그동안 못한 포스팅을 이제야 쓴다. 카톡분석 서비스 주소 카톡분석 왕 테스트 www.advancer-katalk.click 카톡분석 서비스는 기본적으로 카카오톡 파일을 업로드 해야 분석을 시작할 수 있다. (파일은 저장하지 않는다) 그런데 저장후 불러오는 과정이 까다로워 이미지 슬라이드로 설명이 필요한 상황! 아래와 같은 슬라이드 구현이 필요했다. React-slick 과 Carousel React-slick 과 Carousel(캐러셀) 을 이용해 슬라이드를 구현해보자. 1. 설치 npm install react-slick --save npm install slick-carousel --save 2. import import "slick-carousel/slick/slick.c.. 공감수 0 댓글수 0 2022. 8. 5.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.