본문 바로가기

Frontend66

Pinia 기본 사용 방법 (vuex의 새로운 이름) 목차 Vue 기본 구조 Pinia 기본 구조 State (Vue) State (Pinia) Getters (Vue) Getters (Pinia) Actions (Vue) Actions (Pinia) Vue 기본 구조 기본 구조 설명 - Composition API 방식( 다른 방식으로는 Option API 방식이있음 export default{} ) Current Count: {{ counter.count }} Pinia 기본 구조 기본 구조 설명 Option Store방식 기존 방식처럼 state, getters, actions를 직관적으로 표현한다. stores/todos-store.js import { defineStore } from 'pinia' export const useTodosStore .. 2023. 11. 20.
flutter에서 firebase auth 사용하기 flutterfire 깃허브에서 샘플을 제공한다. 아래 urld의 main.dart / auth.dart 를 복붙하기만 하면.. 샘플 화면이 짜잔~~ 물론 코드 복붙하기 전에 firebase Authentication 에 구글로그인, email 로그인 등을 추가해두어야한다. https://github.com/firebase/flutterfire/blob/master/packages/firebase_auth/firebase_auth/example/lib/auth.dart https://github.com/firebase/flutterfire/blob/master/packages/firebase_auth/firebase_auth/example/lib/main.dart 2023. 6. 6.
[error / flutter] There was an error while trying to get your package certificate hash. flutter에서 firebase 인증 세팅을 했는데 오류가 발생 [There was an error while trying to get your package certificate hash.] firebase에 등록했던 인증서 (certificate)가 플레이스토어에서 받은 sha1 이었다..ㅎ android 폴더에서 ./gradlew signingReport 명령어를 입력해서 debug key를 확인할 수 있다. Variant: debug Config: debug 1. 자바가 안깔려있어서 자바 설치했고 2. gradle.properties 에서 jvmargs를 수정(Xmx512x)로 3. 11버전 이상이어야 된다고 해서 다시 설치 후 안드로이드 스튜디오에서 버전 수정 4. ./gradlew signi.. 2023. 6. 6.
Vite + React + tailwind css + firebase 초기세팅 // vite 프로젝트 생성 $ npm create vite@latest 명령어 입력시 선택항목 표시 이름:solyi(프로젝트명) -> 선택:react -> 선택:JavaScript // 프로젝트로 이동 $ cd solyi // 폴더 열기 $ code . -r // tailwind 설치 $ npm install -D tailwindcss // 테스트 실행 $ npm run dev // firebase 설치 $ npm i firebase // firebase-tools 설치 (node version 14.18.1) $ npm install -g firebase-tools@9.2.0 // login $ firebase login $ firebase init 명령어 입력시 선택항목 표시 -> firestore.. 2023. 5. 13.
python 9일차 / 웹스크래핑 풀버전 폴더 구조 main.py extractors / indeed.py extractors / wwr.py 설치 $ pip install beautifulsoup4 $ pip install selenium # main.py from extractors.wwr import extract_wwr_jobs from extractors.indeed import extract_indeed_job keyword = input("What do you want to search for? ") file = open(f"{keyword}.csv", "w", encoding="utf-8-sig") wwr = extract_wwr_jobs(keyword) indeed = extract_indeed_job(keyword) jobs .. 2023. 1. 11.
python 8일차 / indeed / selenium / chromedriver / beautifulsoup / None (data-type) from requests import get from bs4 import BeautifulSoup from extractors.wwr import extract_wwr_jobs # function 을 import # from 폴더명.파일명 import function명 # jobs = extract_wwr_jobs("python") # print(jobs) # base_url = "https://kr.indeed.com/jobs?q=" # search_term = "python" # response = get(f"{base_url}{search_term}") # print(response) # if response.status_code != 200: # print("Fail") # else: # prin.. 2023. 1. 10.
python 7일차 웹 스크래핑 / beautifulsoup 4 / find / find_all / requests / response status_code # 5.0 웹 스크래핑 # beautiful soup (웹사이트의 데이터를 받아올 수 있게 해주는 python 라이블러리) # 5.1 다운로드 # $ pip install beautifulsoup4 # https://www.crummy.com/software/BeautifulSoup/bs4/doc/#quick-start # 5.2 주의사항 # 웹스크래핑으로 상업적 이용시 주의해야한다. from requests import get from bs4 import BeautifulSoup base_url ="https://weworkremotely.com/remote-jobs/search?term=" search_term ="vue" reseponse = get(f"{base_url}{search_term}").. 2023. 1. 10.
[vue]컴포넌트 자세히 알아보기 1. 섹션 소개 컴포넌트 등록 및 스타일에 대해 Component Registration & Styling 컴포넌트를 스타일링 하는 방법과 특정 스타일이 특정 컴포넌트에만 영향을 미치도록 하는 방법도 알아본다 슬롯과 동적 컴포넌트 Slots & Dynamic Components 컴포넌트 이름과 프로젝트 폴더 구조 Naming & Folder structure 2. 전역 컴포넌트Global Components와 지역 컴포넌트Local Components main.js에서 app.component('the-header', TheHeader); 처럼 설정하는건 vue앱의 전역에서 사용할 수 있는 컴포넌트다. 하지만 컴포넌트를 등록하는 방법 중에서 가장 좋은 방법은 아니다. 한가지 잠재적 단점이 있다. 모든 컴.. 2023. 1. 10.
python 6일차 / for ~ in ~ / for loop / requests / status_code # 4.5 For Loops websites = ( "google.com", "airbnb.com", "https://twitter.com", "facebook.com", "https://tictoc.com" ) websites[0] # tuple 의 갯수만큼 반복 for website in websites: print("Hello", website) # 일반적으로 tuple이나 list를 만들 때 복수형으로 만든다 # websites, movies, users, photos ,... # for 에서는 단수형으로 쓴다. # website, movie, user, photo # 4.6 URL Formatting for website in websites: if not website.startswith("h.. 2023. 1. 6.
python 5일차 / method / list / tuple / dictionary # 4.0 Methods # python 에는 3가지 데이터 구조가 있다. # list # tuple # dictionary # 자료구조 Data structure란 무엇일까? # 데이터를 구조화 하고 싶을 때 사용한다. # list # days_of_week = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"] # print(days_of_week) name = "solyi" print(name.upper()) # 대문자로 출력 # upper() 외에도 엄 청 많 은 function 들이 결합되어있다. # "solyi"는 string 인데 내부에 많은 function 을 가지고 있다. # 이것들을 function 이 아닌 method 라고 부른다. # capita.. 2023. 1. 5.
console.log / console.table / console.error / console.info / console.debug / console.warn / console.log() console.group() console.groupEnd() console.table() console.dir() console.error() console.info() console.debug() console.warn() console.clear() const arr = [ { name: 'solyi', birthday: '5/15' }, { name: 'may', birthday: '11/7' } ] console.table(arr) console.info("인포메세지~"); console.debug("디버그~~"); console.warn("와닝와닝~"); console.error("에러메세지~"); console.debug 는 상세 메세지에서 따로 볼 수 있다. 2023. 1. 4.
python 4일차 / and / or / while / input() / int() / import library # 3.3 And & Or # input() 입력 받는 function # int() 값을 숫자로 변경하는 function age = int(input("How old are you? ")) print("user answer : ", age) print(type(age)) # class 'str' if age = 18 and age pc_choice: print("Lower!") elif user_choice 2023. 1. 3.
python 3일차 / if / elif / else # 3.0 if # if condition: # "write the code to run" if 10 == 10: print("True!!") a = "solyi" if a == "solyi": print("YES!") # 3.1 Else & Elif if 10 > 5: print("True") # else 는 옵션이다 무조건 사용해야하는 것은 아님 password_correct = False # True if password_correct: print("Here is your money.") else: print("Wrong password.") # elif (== else if) # else와 마찬가지로 반드시 써야하는것은 아님 winner = 10 if winner > 10: print("winne.. 2023. 1. 2.
반응형

티스토리툴바