본문 바로가기
반응형

전체 글35

[jQuery + HTML + CSS] 오디오 플레이어 만들기 - 1. 회사에서 진행중인 프로젝트에 배경음 삽입기능이 추가되었다. 음원파일 업로드 또는 youtube url등록이 다 가능해야 하는기능. audio 태그와 YouTube API를 같이 사용하기 위한 플레이어를 만들기로 한다. 1. HTML과 CSS로 오디오 플레이어 형태 만들기 2. 각각의 버튼을 만들어 파일 업로드 및 url등록이 가능하게 만들기 3. 음원 업로드시 audio태그를 생성 4. youtube url등록시 API이용하여 iframe생성 작업단계의 큰 틀만 보자면 저렇게 4단계이다. 그래서 만들어진 오디오 플레이어는 아래와 같다. 기본적으로 표기되는 배경음의 속성은 - 재생상태 - 제목 - 재생시간 - 볼륨 이며 새로 링크를 삽입하거나 음원을 업로드하면 플레이어를 아래처럼 초기화 시켰다가 플레이어를.. 2020. 8. 4.
[jQuery + HTML + CSS] 오디오 플레이어 만들기 - 0. 1. HTML로 오디오 태그 만들기 2. 음원 파일 업로드 : input file로 파일 선택 - 확장자 필터링 : form 전송으로 파일 업로드 : 업로드 후 오디오 태그 삽입하여 재생 3. Youtube API로 동영상 적용하기 : 유튜브 URL 입력 - 공유 URL 또는 주소창 URL : URL에서 영상 ID 추출 - 정규식 : API사용하여 iframe적용하여 재생 4. 공통 적용 사항 : 제목 출력 : 음악 재생시 재생시간 초기화 (재생초, 종료시간) : 음악 재생시 소리 70으로 초기화 : 볼륨조절 (음소거) : 재생, 일시정지 2020. 7. 27.
[Vue] Laravel에 Vue 설치하기 및 실행 예제 (Laravel 7.x) * 노드 버전 확인 node -v Node 최신버전으로 셋팅 https://velopert.com/1351 [Node.js] TIP: Node.js 와 NPM 최신버전으로 업그레이드 하기 | VELOPERT.LOG 이번 포스트는 기존에 node.js 가 설치 되어있는 상태에서 Node.js 와 NPM 을 최신버전으로 업그레이드 하는 방법에 대한 팁 입니다. 주의: 일부 모듈에선 v6.0.0 을 지원하지 않습니다. # Node.js 업그레�� velopert.com * PhpStorm vue plugin 설치 Setting -> Plugins -> vue검색 -> install 클릭 -> restart IDE 설치 1. 새로운 라라벨 프로젝트 생성 laravel new vue_test 2. Compoer에.. 2020. 6. 1.
[Laravel] Laravel Schema Designer - 라라벨 구조 설계 https://laravelsd.com/ Laravel Schema Designer users created by sajjad_ser on 21 November 2013 Blog created by angelside on 11 December 2013 users created by raleigh on 04 January 2014 it-helpdesk created by babeman123 on 19 February 2014 Sentry User Extend Social created by memfis61 on 08 April 2014 e laravelsd.com 라라벨 스키마 디자인은 테이블 / 컬럼 / 관계를 사용하여 데이터베이스 스키마를 생성 한 다음 시각적 스키마에서 마이그레이션 파일을 생성 할 수.. 2020. 2. 16.
반응형