💻Front-end 🎨UI, UX 📒Log

#프로젝트 주제 : 생활용품 주기 설정 사이트 ✔ 사용한 기술 : HTML, CSS, Ajax, Flask, Python, MongoDB #목표 : 로그인 상태에서 생활주기 데이터를 적용, 배포✔ #나의 역할 : 프론트 엔드 ✔ @일러스트 포토샵을 통해 전체적은 레이아웃 기획 및 디자인 설계, @시간 주기 설정 사이트 +버튼을 눌렀을때 물품 등록할 수 있는 호버박스 버튼 구현 - 버튼을 눌렀을때 물품 등록할 수 있는 호버박스 삭제 버튼 구현 호버박스 버튼 클릭시 모달창 페이지 연결 모달창 페이지 구현 #업무 중 이슈 및 해결한 내용 ✔ 위 4개의 기능을 구현하는데 있어서 처음이여서 많이 어려움을 겪었는데 구글링과 팀원들의 소통을 통해 구현을 할수 있었고 모달창 페이지에 장소, 물품, 이미지 주기 데이터 ..

@5-1. DB만들기 (데이터 쌓기) import requests from bs4 import BeautifulSoup from pymongo import MongoClient client = MongoClient('localhost', 27017) db = client.dbsparta # DB에 저장할 영화인들의 출처 url을 가져옵니다. def get_urls(): headers = { 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64)AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36'} data = requests.get('https://movie.naver.com/mo..

@4-1. Flask #시작 코드 > localhost:5000 접속 from flask import Flask app = Flask(__name__) @app.route('/') def home(): return 'This is Home!' if __name__ == '__main__': app.run('0.0.0.0',port=5000,debug=True) #파일 만들기 static : CSS, 이미지 파일 담아둘때, templates : Html 담아둘때 from flask import Flask, render_template, jsonify, request @app.route('/') def homework(): return render_template('index.html') render_ te..

@3-1. 로딩 후 바로 실행 코드 $(document).ready(function(){ listing(); }); function listing() { console.log('화면 로딩 후 잘 실행되었습니다'); } @3-2. 파이썬 (변수, 자료형, 함수, 조건문, 반복문) 변수 : # 숫자와, 문자열을 같이 쓸때 ex) first_name = 'jonghun' , num = (2) 괄호쓰기 리스트 : #원소 추가 a_list.append('XX') 딕셔너리 : a_dict = {'name' : 'bob','age' : 27} print(a_dict['age'] 함수 : def sum(다른 용어 가능)(num1, num2): return num1+num2 result = num(1,2) 조건문 : a..

@2-1. 전역변수 @2-2. JQuery id = article-url >>> $('#article-url').(val, text) (); 지칭 / hide : 숨김 show : 보임 let temp_html = ` `(자주 씀) // 변수 넣기 : ${내용} includes : 구별 하기 let domain = txt.split('@')[1].split('.')[0] : 나누기 $('#names-q3').empty() empty : 다 지우기 @2-3. Ajax $.ajax({ type: "GET", url: "여기에URL을입력", data: {}, success: function(response){ console.log(response) } }) -----------------------------..

@1-1. HTML, CSS 나는 구역을 나누죠 나는 문단이에요 bullet point!1 (앞에 점) bullet point!2 h1은 제목을 나타내는 태그입니다. h2는 소제목입니다. h3~h6도 각자의 역할이 있죠. 비중은 작지만.. span 태그입니다: 특정 글자를 꾸밀 때 ex) 한 글자씩 색 넣을때 a 태그입니다: http://naver.com/"> 하이퍼링크 img 태그입니다: https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" /> input 태그입니다: button 태그입니다: 버튼입니다 textarea 태그입니다: 나는 무엇일까요? --------------------------------..