FE/react-native
react-native 로딩바 적용해보기
ActivityIndecator을 쓰면 된다. import { ActivityIndicator } from 'react-native'; 이런식으로 import를 해주고, 컴포넌트처럼 써주면 된다. 내부에 스타일도 저런식으로 넣어줄 수 있다. 결과
전체 글
지식에 정성을 들이는 습관을 갖자 대충 절대 금지
FE/react-native
react-native에서 open weather api를 이용해 날씨 정보 가져오기
Weather API - OpenWeatherMap Please, sign up to use our fast and easy-to-work weather APIs. As a start to use OpenWeather products, we recommend our One Call API 3.0. For more functionality, please consider our products, which are included in professional collections. openweathermap.org 위 사이트에서 무료 날씨 정보를 얻어올 것이다. 가입하고 Current Weather이나 3-hour Forecast 5 days 중 하나를 선택해 들어가 subscribe를 한다. 가만 읽어보니 ..
FE/react-native
react-native에서 expo-location을 이용해 유저 위치 정보 가져오기
1. expo-location 다운 expo install expo-location 2. expo-location 사용법 import * as Location from "expo-location"; export default function App() { const [location, setLocation] = useState(); const [ok, setOk] = useState(true); const ask = async () =>{ const permission = await Location.requestForegroundPermissionsAsync(); console.log(permission); } useEffect(()=>{ ask(); },[]); } //결과 {"canAskAgain":..
FE/react-native
react native는 기본 flex box 기반이다.
https://reactnative-archive-august-2023.netlify.app/docs/0.65/scrollview ScrollView · React Native Component that wraps platform ScrollView while providing integration with touch locking "responder" system. reactnative-archive-august-2023.netlify.app 주로 공식문서에서 react native 기본을 떼자 1. flex 웹에서는 flex direction 기본 방향이 row이지만, react native에서는 기본 방향이 column이다. 핸드폰의 크기는 정말 다양하기 때문에 대부분 width나 height을 설..
대외활동/SSAFYicial
[CS 정리는 내가 할게, 면접은 누가볼래? - 프론트엔드/React편] 프론트엔드/React 면접 질문 필수 암기 모음집 1탄
안녕하세요 : ) SSAFYicial 9기 신산하입니다. 8월의 기획기사는 React 면접 질문 모음입니다! 공통 프로젝트 때 프론트엔드를 맡았던 여러분들, 기초 지식을 머리에 넣고, 후회없는 면접 봅시다! LET's GO! 1. 함수형 컴포넌트와 Class형 컴포넌트 방식의 차이점에 대해서 답변해주세요. 함수형 컴포넌트 import React from 'react'; import './App.css' function App(){ return( 안녕 ) } 클래스형 컴포넌트 import React, {Component} from "react"; export default class App extends Component{ render(){ return( 안녕 ) } } 1) 선언 방식의 차이 클래스형 컴..
대외활동/SSAFYicial
[회고] 내가 만약 공통프로젝트 1일차로 돌아간다면? 공통프로젝트를 마치며 깨달은 것들
안녕하세요 : ) SSAFYicial 9기 신산하입니다. 2학기 1차 프로젝트 공통프로젝트의 6주가 벌써 막을 내렸습니다!!! 2학기 공통 프로젝트를 끝내시고, 모두 깨달으신 점이 많을 것이라 생각합니다. 저도 무척 많은데요... 앞으로 프로젝트를 진행하게 될 10기 여러분들, 그리고 앞으로 2개의 프로젝트가 더 남은 9기 여러분들께 후기를 공유하고 향후 더 윤택한 프로젝트 진행을 하셨으면 좋을 것 같아 이번 기사 주제를 정하게 되었습니다 : ) 1. 주제 선정은 중요하다 feat. 웹 기술 저희팀은 의견이 무척 많은 팀이었습니다. 때문에 주제도 10건 이상 나왔죠. 저희 팀 첫 주제는 강아지 분양 서비스 였습니다. 소중한 나의 가족이 또 다른 가족을 낳게 되었을 때 정말 슬픈 일이지만 여력이 안돼 다른..
FE/React
[React] jsx 함수형 기본구조 : import React from "react"는 왜 쓸까?
import React from "react"; const Closet = () => { return( ); } export default Closet; 브라우저는 HTML, CSS, JavaScript만 읽을 수 있기 때문에 우리가 작성한 React를 읽지 못한다. 따라서 React로 작성한 코드를 브라우저가 읽을 수 있도록 변환해주어야 한다. 리액트에서 JSX 문법을 사용하는데, 이 JSX 문법을 자바스크립트로 변환시킬 때 JSX transfomer를 사용해 JSX로 작성된 React 메소드를 변환시킨다. 이 때 객체인 React를 가져오기 위해서 import React from 'react'를 맨 위에 작성해 React를 불러오게 되면 객체 React를 통해 React 메소드를 작성할 수 있게 된다..
알고리즘/백준
[DFS/구현] 백준 15683번 감시 - JAVA
쉬울 줄 알고 덤볐다가 구현력에 한계를 느낀 문제이다. 알고보니 삼성 기출문제였다는 소리를 본 것 같다 ^__^... 1. 출처 15683번: 감시 스타트링크의 사무실은 1×1크기의 정사각형으로 나누어져 있는 N×M 크기의 직사각형으로 나타낼 수 있다. 사무실에는 총 K개의 CCTV가 설치되어져 있는데, CCTV는 5가지 종류가 있다. 각 CCTV가 감 www.acmicpc.net 2. 설계 처음에는 쉬운 문제인 줄 알았던 이유가 각 감시카메라에 대해 많은 영역을 커버할 수 있는 방향을 정하고, 커버 영역을 세서 남은 영역에 대한 최소값을 구하고자 했다. 그런데, 이렇게 하면 다른 감시 카메라가 감시했던 영역도 또 감시했다고 체크해서 전체 영역이 20개인데, 감시 영역이 20을 훌쩍 넘어버릴 수 있다. ..