모아이

MS클라우드 플랫폼 Azure 서비스 클라우드 서비스는 앞선 AWS내용에서 다룬적이 있는데 각종 애플리케이션 소프트웨어나 하드웨어들을 클라우드 사용자가 대여할 수 있고 데이터 서비스부터 배포 개발환경등 또한 빌려서 바로바로 사용할 수 있다보니 물리적인 서버를 가지는 것보다 비용적, 시간적 절감이 확실하며 유연성 또한 존재한다. 클라우드 서비스의 종류 클라우드 서비서의 진화 프라이빗 클라우드 인프라가 단일 사용자 조직 전용 인 클라우드 컴퓨팅 모델이다./ 보안 우수 그렇기에 퍼블릭과는 다르게 컴퓨팅 리소스가 전용이고 독점적이며, 단일 조직이 시스템을 호스팅하고 관리한다. 하이브리드 클라우드 하나 이상의 프라이빗 클라우드와 하나 이상의 퍼블릭 클라우드의 조합 멀티클라우드 2개 이상의 퍼블릭 클라우드, 2개 ..

S3 버킷을 파이썬에서 boto3 EB를 이용해 백엔드로 서버를 일단 움직여보려 했으나 아직 실력이 부족해 EC2를 이용해 서버를 운용했다. 그 과정에서 유저들의 데이터를 S3로 받았고 파이썬 boto3를 이용해 코드를 구상했다. 일단 소스 내에서 키를 받게 했는데 후엔 보안상의 문제로 깃이나 EB에서 시크릿 키로 전환 할 생각이다. s3 = boto3.client('s3', aws_access_key_id=AWS_ACCESS_KEY_ID, aws_secret_access_key=AWS_SECRET_ACCESS_KEY ) 여기서 =aws_부분은 각자 가지고 잇는 키 아이디와 시크릿 키를 넣으면 된다. 이후 POST된 파일을 request.files로 받아온 후 파일 저장을 하면 된다. #파일 값 받아오기..

카카오 지도API-로드뷰,커스텀 오버레이 일단 지도 생성부터 주소로부터 좌표 값을 구하는 것 같다. var geocoder = new kakao.maps.services.Geocoder(); geocoder를 이용해 좌표 변환 객체 이후 추가할 오버레이를 만든다 var content = ''; content += ' 여기서 만나요!'; content += ' '; content += ' '; content += ' {{ post.address }}'; content += ' '; content += ''; 이후 주소에서 좌표값을 계산한 후 커스텀 오버레이를 좌표 상에 띄울 수 있게 만든다. geocoder.addressSearch(local, function (result, status) { if (st..

캘린더 기능 일단 부트스트랩 ( https://getbootstrap.kr/ )을 이용해 캘린더를 만들어 볼 수 있지만 나는 daterangepicker라는 라이브러리를 이용했다. (참고문서 - https://www.daterangepicker.com/ ) 작동 하게 되면 이렇게 되며 확실히 좀 더 이쁜 편이다. 다만 외국 개발자가 만든 라이브러리여서 한국어 패치를 하나하나 해줘야 한다. 사용하기전 라이브러리를 집어 넣어야 하는데 이 라이브러리를 임포트 하자! 내가 사용한 코드 여기서 autocomplete="off"는 자동완성을 끄는 기능이고 실제로 달력을 입력하는데 자동완성이 나와 날짜를 가리길레 찾아서 적용시켰다. 에는 아래 코드를 이용했다. function calender_select() { $(..

카카오 지도 API ( https://apis.map.kakao.com/web/sample/basicRoadview/ ) 이곳을 이용하면 샘플 데이터를 볼 수 있는데 확인 해 보면서 원하는 부분만 추려가보도록 하자. 라이브러리 부분을 전혀 생각 안하고 있다가 왜 동작안하지로 한참을 헤맸는데 apikey값을 넣는 것 뒤에 libraries 추가를 항상 신경쓰자. 커밋메세지 feat : 새로운 기능에 대한 커밋 fix : 버그 수정에 대한 커밋 build : 빌드 관련 파일 수정에 대한 커밋 chore : 그 외 자잘한 수정에 대한 커밋 ci : CI관련 설정 수정에 대한 커밋 docs : 문서 수정에 대한 커밋 style : 코드 스타일 혹은 포맷 등에 관한 커밋 refactor : 코드 리팩토링에 대한 ..

Bulma ( https://bulma.io/documentation/ ) 앞서 배웠던 부트 스트랩과 동일하게 보면 됨. 무료 CSS프레임 워크 -부트스트랩과의 차이 Bootstrap은 jQuery를 써서 웹사이트에서의 상호작용을 쉽게 구현할 수 있지만 Bulma는 순수한 CSS 프레임워크이기 때문에 기능을 직접 구현해야 한다. 대신 자유로운 커스터마이징이 가능 Bootstrap은 커뮤니티가 커서 테마나 플러그인 등이 개발이 많이 되어있고 질문에 대한 답이나 예시 등을 찾기 쉽다. Bulma는 문법이 직관적이고 Flexbox등 최신 기술이 더 많다 -Bulma 링크 임포트 페이지에 사용한 CSS를 파일로 분리 할 때 Bulma의 클래스들을 커스터 마이징 해서 사용했다면 Bulma의 링크보다 아래에 넣어야..

간단한 카카오 지도 api (참고문서 - https://apis.map.kakao.com/web/guide/ ) 문서의 준비하기- 시작하기 태그를 보면 도메인 등록과 appkey 받는 법이 상세하게 적혀있으니 직접 따라해보자. 카카오 지도는 지도를 그리는 javascript API를 먼저 불러오면 실행이 안되는 오류가 있는데 참고 문서 순서에 맞게 진행해 보자. 1.지도를 담을 영역 2.지도를 그리는 JavascriptAPI불러오기 appkey는 만들었던 애플리케이션에서 appkey 부분의 java key를 가지고 오면 된다. ※//이라는 상대 프로토콜을 사용하면, 사용자의 http,https 환경에 따라 자동으로 해당 프로토콜을 따라가게 됨. api를 로이하는 스크립트 태그는 html파일 안의 head..

selenium 브라우저 제어 - 내가 필요한 정보를 얻기 위해 로그인, 스크롤 등의 브라우저 동작이 필요할 때 selenium을 이용하자 - 웹 스크래핑 뿐만 아니라 브라우저 제어 기능을 응용하면 정해진 시간에 게시판에 글을 작성하는 등 다양한 업무를 자동화 할 수 있다. -bs4와 requests 만으로 스크래핑이 잘 안되는 이유가 있는데 그 둘은 스캔본을 받아서 하 듯 정적인 부분만을 가져와 스크래핑을 하기 때문이다. -동적인 웹페이지를 스크래핑 할 때는 브라우저에 띄운 후 소스코드를 가져오는 방법을 써야하기 때문에 selenium을 사용해 보자 예시) 셀레니움 적용 from bs4 import BeautifulSoup from selenium import webdriver from time imp..

동적 페이지와 정적페이지 정적 웹페이지(static web page)는 서버에 저장되어 있는 HTML+CSS파일 그대로 보여주는 것이고 추가적인 통신과 계산이 필요없이 때문에 속도가 빠르고 서버에 부담이 적은 반변 추가/수정/삭제 등 내용 변경이 필요할 때 HTML자체를 수정해야 해서 번거롭다 동적 웹페이지(dynamic web page)는 상황에 따라 서버에 저장되어 있는 HTML에 데이터 추가/가공을 해서 보여주는 것으로 한 페이지에서 상황/시간/사용자요청에 따라 다른 모습을 보여줄 수 있다는 장점이 있지만 상대적으로 보안에 취약하고 모습이 계속 변하기 때문에(많은경우 주소도 변함) 검색엔진 최적화(search engine optimazation,SEO)가 어렵다 동적 웹 페이지 종류 -Client-..

extension = file.filename.split('.')[-1] 파일업로드 기능 -프론트엔드 부트스트랩을 이용해보자! 또는 찾아보니 form 태그를 이용하기도 한다. 모든 이미지 파일을 허용 파일 업로드 라이브러리 bsCustomFileInput.init() 스크립트 부분은 헤드에 넣고 아래 init은 스크립트에 넣자 예시) $(document).ready(function () { /*창이 로딩되는 순간 아래의 기능을 작동시켜주세요*/ bsCustomFileInput.init() }) -DB를 통해 서버와 클라이언트 파일 주고받기 서버쪽 file = request.files["file_give"] /*file_give로 정보를 받아온다*/ save_to = 'static/mypicture.jpg..