728x90
반응형
SMALL

처음 보험다모아 사이트를 보고 다이렉트만 가능하다는 점, 연령이나 금액의 폭이 작은 점에서 아쉬움이 있어서 

처음 의도는 연령과 금액대를 더 다양하게 해는 것에 목표를 두고 만들다가

그렇다 시간이 없었다!!!!!ㅠㅠㅠㅠ

 

그러다가 전에 mbti 유형검사를 만들었던 것이 생각이나서 여기에 접목해서 만드는 것도 활용하기 쉬울 것 같아 

만들기 시작했고, 완성했지만, 문제점이 발견되서 현재 잠시 중단상태이다!

 

1. 시작하기 버튼 가운데로 하고 크기를 키우거나  

  버튼이 왜 왼쪽에 있나 고민하다 

  div안에 버튼이 없어서 왼쪽에 고정되어있었다..

 (어쩐지 왜 안되나 고민 많이 했는데 해결!!)

  크기를 키우는 것 보다 이미지를 클릭했을 때 시작하는것이 더 좋을 것 같아 수정중이다.

2. 이미지를 클릭하면 시작하게 되게 만들기 -> 여기에 json걸면 될거같아서 ㅎㅎㅎㅎ시도해볼 생각이다.

  12월 18일 현재까지 수정 중인 내용!

   완성하게 된다면 만든 순서를 정리해서 올릴 계획! 

   오늘은 여기서 이만! 밑에 파일은 영상이며 영상을 연결할 줄 모른.............ㅠㅠㅠㅠㅠㅠㅠㅠ

3. 왜 왼쪽으로 치우쳤나... 

   전체적으로 왼쪽으로 치우친 것

 

모바일 화면.mp4
3.51MB
브라우저 화면.mp4
3.00MB

 

22년 12월 17일에 완성은 했다.

이걸 조금 더 다듬고 하는 것이 필요할거 같아 전체적인 내용은 추후에 올릴 계획!

수정완료~
https://github.com/aihtnyc-h/insurance-type-test

728x90
반응형
LIST

'개발 > 프로젝트' 카테고리의 다른 글

토이프로젝트 - devstagram  (0) 2023.01.09
팬명록 완성하기!  (0) 2022.12.20
지니차트 만들기  (0) 2022.12.16
팬명록 현재 기온 넣기!  (0) 2022.12.11
팬명록 메인 페이지 만들기  (0) 2022.12.04
728x90
반응형
SMALL

순위 뽑아내기!

순위 뽑아내기!

#body-content > div.newest-list > div > table > tbody > tr:nth-child(1) > td.number
#body-content > div.newest-list > div > table > tbody > tr:nth-child(2) > td.number

1위, 2위의 소스를 보았을 때

‘#body-content > div.newest-list > div > table > tbody > tr'

중복성을 확인하고

trs=soup.select() 안에 넣기!

trs = soup.select(’#body-content > div.newest-list > div > table > tbody > tr’)

rank 먼저 확인하기

rank에 제한을 [0:2]넣으면

1부터 50까지 띄엄띄엄 나열된다.

다시 정리해서 위로 올려서 print로 출력하면 1부터 50까지 쭉 나열~

 

 

제목 뽑아내기!

순위와 같은 방법으로 시작!

제목에서 검사 클릭

소스를 복사하면

# body-content > div.newest-list > div > table > tbody > tr:nth-child(1) > td.info > a.title.ellipsis

'td.info > a.title.ellipsis'를 뽑아온다!

title = tr.select_one('td.info > a.title.ellipsis')로 채우고

뒤에 .text.strip() 붙이고

print에 title도 넣어서 출력하게 되면

등수와 제목을 한번에 출력할 수 있다!

 

아티스트 뽑아내기!

 

#body-content > div.newest-list > div > table > tbody > tr:nth-child(1) > td.info > a.artist.ellipsis

td.info > a.artist.ellipsis 뽑아내기!

artist = tr.select_one('td.info > a.artist.ellipsis').text

셋다 하면 이렇게 결과가 나온다!

지니 차트 만들기 완료

728x90
반응형
LIST
728x90
반응형
SMALL

항해 2주차 수업 완료~!

2주차에서는 ajax를 공부!

(세상에서 제일 어려운게 정리라고 하는데....)

손으로는 이걸 꾸밀 수 있겠는데 컴퓨터로 정리하는게 참.. 힘들당...

 

#ajax

<script>
    $(document).ready(function(){
     $.ajax({
            type: "GET",
            url: "http://spartacodingclub.shop/sparta_api/weather/seoul",
            data: {},
            success: function (response){
                let temp = response['temp']
                $('#temp').text(temp)
            }
        })
    });
</script>
<style>밑에 위에 사진 처럼 
type: "GET",  
-> 저는 여기서  외부 url에서 데이터를 가져오기 때문에 구해서 넣는다 라고 생각합니다! 
(사람마다 생각은 다르니깐여, 그냥 제가 하나하나 기억하기 쉽게 해석할려고 끼워 맞춘것도 맞아여..ㅎ)
url: 주소!
-> 외부에서 주소를 넣으면 됩니당
data: {}

-> 외부에서 주소에 있는 데이터를 가져와서 비워두는 것 같다

<p>현재기온 : <span id="temp">00.0</span>도 </p>

success: function (response){

let temp = response['temp']

-> id에 기온을 temp으로 정했기 때문에 ajax안에  서도 temp을 지정!

$('#temp').text(temp)

-> '#' 로 id를 호출!! 

#temp

 

success: function (response) {
    console.log(response)
}

 

success: function (response) {
 
    let temp = response['temp']
    console.log(temp)
}

 

success: function (response) {

    let temp = response['temp']
    $('#temp').text(temp)
}

 검사로 들어가서 console에서 현재 온도가 나오는지 확인하고

밖으로 끌어오기 위해 <p>와 <spen>으로 묶기!

현재기온을 넣을 수 있다!

물론 

<body> 안에

<h1>아이들 팬명록</h1>
    <p>현재기온 : <span id="temp">00.0</span>도 </p>
</div>

<p>를 사용하여 넣어야 한다!

 


오늘도 (여자)아이들은 멋졌고,

멜론에서 상을 못탄게 솔직히 저도 이해가 안됩니다!!!!!

화나고 분하지만 항상 좋은 음악과 멋진 모습을 기대하며 오늘의 응원은 여기서 마무리하겠습니다~


강의를 쭉 들을 수 있는 시간이 있으면 좋겠는데 그게 힘들어서 

걱정입니다 ㅠㅠ

다음주 강의는 파이썬인데

이거 파이썬 대학교때 수업때 간단한거 빼고 한적이 없는뎁...

걱정걱정

파이썬 기초 강의 공부하기!

월, 화 연수원 또가는데.... 살려주세영....

 

 

728x90
반응형
LIST

'개발 > 프로젝트' 카테고리의 다른 글

토이프로젝트 - devstagram  (0) 2023.01.09
팬명록 완성하기!  (0) 2022.12.20
[개인 프로젝트] 나에게 맞는 보험 상품 찾기  (0) 2022.12.18
지니차트 만들기  (0) 2022.12.16
팬명록 메인 페이지 만들기  (0) 2022.12.04
728x90
반응형
SMALL

뮤비하고 같이 들으면서 세상사람들이 편견에 차있던것 처럼 나도 편견이 많았구나

전소연은 천재가 맞구나..!!

 

뮤비, 가사 등 빠지는 것 하나 없이

그렇게 생각하는 건 너의 편견일 뿐이야!

당당하게 자기 생각을 밝히고 실현하고 보여준다는 점에서

다시 한 번 반하게 되었죠..ㅎㅎㅎㅎ

 

그래서 숙제로 팬명록을 만들겸 (여자)아이들을 pick!!

 

○프로그램은 PyCharm 2022.3 

○파일 형식 .html

   완성본은 바로 아래 사진과 같습니다.

 

html의 기본문!

[lang 뒤에 언어! ("en"  // "ko")]

<html>

<head>

<title>제목</title>

</head>

</html>

 

를 기본으로 하여 시작하기!

언어체계는 "utf-8" 호환안되면 한글은.....깨져버려요....ㅠ

부트 스트랩사이트에서 소스를 가져오기 위해  붙여넣기 필수!

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
 
여기까지 기본적으로 세팅되어있어야하는!
crossorigin="anonymous"
 
익명이 아닌 자신만의 이름 또는 별명을 넣기!!
 
title에 내가 정한 제목과 폰트를 정해서 넣기!
<title>iUIN</title>
*폰트 넣는 방법
구글 폰트 검색 (https://fonts.google.com/?subset=korean)

 

원하는 폰트를 찾아서

클릭후 오른쪽 상단에

클릭하기!

 

<head> of your html

밑에 link부터 복사하기!!

 

 

 

 

 

 

 

 

 

맨아래쪽  CSS부분 복사해서

 

바로 밑에 <style>을 넣어 폰트를 전체적용!

* {

}

-> 전체적용시키기!

 

 

<style>은 잠시 미뤄놓고~

<body>부터 시작하기~~

<div>

<h1>아이들 팬명록</h1>

</div>

// CSS파일을 따로 만들기... 무진장 귀찮아요... 그래서

<div class="mypic">

<h1>아이들 팬명록</h1>

</div>

 

div에 class를 넣어 위쪽의 스타일에서 다시 꾸며주기!

mypic은 자기마음대로 변경가능!

*^^*

<style>

.mypic {

            background-color: green; // 사진을 설정하기 전까지 색깔로 표현해서 위치 확인하기!
            width: 100%;
            height: 800px;

            background-position: center ;
            background-size: cover;

            color: rebeccapurple;

            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

}

</style>

 

Floating labels · Bootstrap v5.0 (getbootstrap.com)

 

Floating labels

Create beautifully simple form labels that float over your input fields.

getbootstrap.com

구지 꾸밀 필요 없이 여기서 복사해서 쓰면 편합니당~~

 

 <div class="form-floating mb-3">
        <input type="email" class="form-control" id="floatingInput" placeholder="name@example.com">
        <label for="floatingInput">수정하기!!</label>
    </div>
    <div class="form-floating">
        <input type="password" class="form-control" id="floatingPassword" placeholder="Password">
        <label for="floatingPassword">수정하기!!</label>
    </div>

를 가져와서 수정하기!

 

버튼과 코멘트도 복사 붙여넣기!

이메일 폼, 버튼, 코멘트를 한번에 div로 묶어서 class를 해주기!

 

후에 style에 넣어서 조정하기!

 

완성본!!

살짝 글씨 굵기나 색상이 마음에 안들기는 한데... 아이들하면 보라색.. 바꿀수 없었다... 굵기는 여러가지 해봤는데.. 

너무 굵어도 이상해서 일단... 여기서 만족하고 끝내기!!

 

 

12기 시작은 1월 9일부터지만, 미리 시작 ㅎ

 

그동안 만들었던 내용들을 순서대로 올릴 계획인데....

정리를 하기가 힘들군여....ㅎㅎㅎㅎㅎㅎ

사진도 있어야하고 절레절레

그냥 하나씩 야금야금 올릴 계획입니당~

아직 회사를 다니고 있어서 ;;;

시간 날때마다 조금씩 정리해서 올리기!

 

// 2018년도 C언어 기초를 배웠고 여기서 핵맨게임을 만들 정도의 수준까지 만들어서 계속 연습하면서 유지하다

자바를 독학으로 공부하다 학원에가서 공부를 다시 시작했어요 ㅎㅎ

그러다가 에러가 나면 짜증도 나고 화도 나고 해결하면 허탈하긴 하는데 

남들이 보면 변태같다 생각하겠지만...ㅎ 만족감과 성취감이 다른 일에 비해 크게 다가와서

이쪽으로 취업을 하고 싶어 항해99를 선택하게 되었습니다.

 

// 망설이시는 분들 저는 고등학생때 이과생이긴 했어요

학과가 경영, 금융, 경제, 회계, 법 이쪽이여서

학교에서 하라는 데로 하는 사람이여서..ㅎ

근데 인턴으로 간 회사에서 C언어를 배우라고 거의 강제로 말을 해서 억지로 학원 등록했는데

의외로 할만하더라구여 (물론 에러나면 눈이 아프고 나는 누구인가? 많이 생각했어요.)

그 뒤로 혼자 공부하다가 발전이 없어서 학원에 간거지 

누구나 시도할 수 있다는게 저는 더 좋은 기회가 아닌가 싶어요!

 

 

 

 

@aihtnyc_h 사칭아니고.. 인스타 계정과 동일인물 맞습니다.

사칭이라고 신고당하고

사기꾼이라는 말도 듣고

흑흑...ㅠ

(운동 계정인데.. 개인계정은 모두 다른거 아니겠어요^^)

 

 

728x90
반응형
LIST

'개발 > 프로젝트' 카테고리의 다른 글

토이프로젝트 - devstagram  (0) 2023.01.09
팬명록 완성하기!  (0) 2022.12.20
[개인 프로젝트] 나에게 맞는 보험 상품 찾기  (0) 2022.12.18
지니차트 만들기  (0) 2022.12.16
팬명록 현재 기온 넣기!  (0) 2022.12.11
728x90
반응형
SMALL
  • 단축키 모음
    • 새로고침
      • F5
    • 저장
      • Windows: Ctrl + S
      • macOS: command + S
    • 전체선택
      • Windows: Ctrl + A
      • macOS: command + A
    • 잘라내기
      • Windows: Ctrl + X
      • macOS: command + X
    • 콘솔창 줄바꿈
      • shift + enter
    • 코드정렬
      • Windows: Ctrl + Alt + L
      • macOS: option + command + L
    • 들여쓰기
      • Tab
      • 들여쓰기 취소 : Shift + Tab
    • 주석
      • Windows: Ctrl + /
      • macOS: command + /
728x90
반응형
LIST

+ Recent posts