대충 이런 느낌의 심플하면서도 예쁜 쇼핑몰을 만드는 것이 목표이다 가장 처음에 해주어야할 것이 background image를 크게 삽입해주는 것 image라는 div안에 배경이미지를 삽입해줄 것이다 .image{ height:750px; background-repeat:no-repeat; background-image:url(img/kids101.jpg); background-size:cover; } background-size:cover특성은 값을 cover 로 지정하면 배경이미지의 가로, 세로 길이 모두 요소보다 크다는 조건하에 가능한 배경 이미지를 작게 조정합니다. 가로, 세로 비율은 유지됩니다. 따라서 배경 이미지의 크기는 요소의 크기보다 항상 크거나 같습니다. 아래 예제의 크기를 조절해서 실제..
https://ovenapp.io/ OvenApp.io Oven(오븐)은 HTML5 기반의 무료 웹/앱 프로토타이핑 툴입니다. (카카오 제공) ovenapp.io 보통 프로젝트를 진행할때 ui구상을 먼저 한다 보통 나 같은 경우는 노트에다 직접 그리면서 하고, 또 어떤 사람은 패드에다 그리며 해본다 그런데 더 편리한 사이트가 있다 카카오오븐인데 사이트에 접속해 회원가입만 하고 새 프로젝트를 만들어 페이지를 추가하며 ui를 구상해볼 수 있다 오른쪽에 요소, 아이콘, 이미지 등이 있는데 요소와 아이콘을 사용해 실제 안드로이드 화면같은느낌을 줄 수있다 이렇게 만들면 더 직관적이고 디자인적으로도 한 눈에 들어와 ui 제작할때 상당히 편한 사이트인 것 같다 다음 프로젝트때 써야지
https://github.com/the-groot/mudi GitHub - the-groot/mudi Contribute to the-groot/mudi development by creating an account on GitHub. github.com 기본적인 기능을 구현해서 github에 올리고 readme파일좀 정리하고 이 프로젝트를 마무리하려고한다 개인적인 아쉬움으로는 1. 배포를 하지 못한 점, 2. css를 적용하지 못한점이 있다 1번같은경우 배포를 하려면 express에 대한 개념, docker, aws, ec2 등에 대해 알아야하는데 아직 건드리지 못하겠고 내가 찾아본바에는 express를 좀 다룬 후에 배포가 가능한 것 같다 로그인&회원가입기능.. 등등 2번또한 마찬가진데, css를 ..
삭제를 어떻게 구현할까고민하다 플레이리스트마다 할당된 id를 delete버튼마다 주어서 delete 버튼을 누르면 으로 id를 submit해주어서 해당 플레이리스트 id를 가진 것을 삭제한다 마찬가지로 곡도 곡마다 delete버튼을할당하고 songid를 delete버튼에 부여하고 버튼이 눌리면 id를 submit해서 삭제해준다 그리고 곡의 개수도 하나 지워준다 이제 다음 단계로는 곡 제목, 가수, 기록, 플레이리스트 이름 수정 update를 구현하면 delete랑 update버튼을 묶어서 hide해놓거나 생활코딩에서 말해준 검색, 정렬기능을 구현해볼까 한다
아직은 플레이리스트 추가밖에 못한다 곡 추가기능은 조만간 구현할 예정이다 생활코딩 nodejs, nodejs-mysql강의를 다 듣고 생활코딩의 코드를 수정하는 방법으로 내가 원하는 홈페이지를 만들어가고 있다 한 가지 문제점은 플레이리스트라는 테이블안에 song이라는 테이블을 넣고싶었는데 mysql에는 테이블 안에 테이블을 넣을 수 있는 방법이 없다고 한다 그래서 calm이라는 플레이리스트를 생성하면 calm_song이라는 테이블을 동적으로 생성해 거기에다 곡을 저장할까 생각해봤는데, 그러면 플레이리스트 하나당 테이블이 하나씩 동적으로 계속 생기기때문에 그냥 playlist, song이라는 테이블을 만들고 playlist에 플레이리스트 이름, song에 제목,가수,기록을 한 다음 song에 playlis..
nodejs를 통해 사용자로부터 입력받은 플레이리스트, 곡에대한 정보를 받아와 내 로컬 환경에 동적으로 파일을 생성하는데 성공했다 nodejs는 javascript의 기본 문법을 따르지만 실제 코드를 보면 낯선 코드들이 많았다 var http = require('http'); var fs = require('fs'); var url = require('url'); var qs=require('querystring'); require이라는 문법으로 http,fs(filesystem),url,querystring을 받아온다 function templateHTML_Song(title,list,body){ return ` WEB ${body} `; } 그리고 기존에는 플레이리스트의 개수만큼 html을 생성해주어..
한계에 봉착했다 1. 곡 영구 저장 x - 사용자로부터 정보를 입력받고 html파일에 동적으로 추가할 수는 있지만 새로고침하면 데이터가 사라진다 2. 플레이리스트 추가 x -플레이리스트 장르마다 html링크가 하나씩 걸려있는데, 이 html파일은 내가 미리 만들어둔 파일이다 즉, 사용자로부터 장르 추가를 받아 새로운 목록을 추가하면 html파일도 동적으로 생성이 되어야 하는데 자바스크립트만으로는 불가능하다 그래서 찾아본 결과 1번을 해결하기위해서는 데이터베이스, 2번을 해결하기위해서는 서버의 힘이 필요하다고한다 1번은 대표적으로 oracle, mysql(mariadb)가 있고, 2번은 대표적으로 node.js, jsp, php가 있다 1번은 무료인 mysql을 선택할 것이고 2번은 jsp는 대규모, 난이..
- Total
- Today
- Yesterday
- 우분투
- 데이터베이스
- DML
- CSS
- 데이터 3법
- 데이터3법
- html
- 오픈소스
- 클로아
- 로스트아크 캐릭터
- infcon 2024
- oauth
- bfs
- git commit 수정
- SQL
- oauth2.0
- DDL
- authorization_code
- kloa
- Android Studio
- html #웹 #웹사이트 #플레이리스트
- 인프콘2024
- javascript
- 2024인프콘
- authorization code
- 프로그래머스
- 리눅스
- git 예전 커밋 수정
- git
- SpringBoot
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |