yevdev◡̈

📌 일곱번째 프로젝트 NRC Onboarding 앱을 만들어보자 1️⃣ Data 확인 및 SearchViewController 만들기 - 이전 프로젝트들과 마찬가지로 패캠에서 제공해준 데이터들을 사용 - "OnboardingViewController" 이름의 UIViewController을 만들어서, Main storyboard와 연결까지 완료 2️⃣ 배경이미지 넣기 - 배경 이미지는 Assest에 있음 3️⃣ StackView를 이용하여 하단에 버튼 넣기 4️⃣ Page Control + Collection View - View에 수평방향 맞게하고, StackView와의 vertical 거리는 40으로! 5️⃣ UICollectionViewCell 만들기 - "OnboardingCell" 이라는 이름으..

📌 네번째 프로젝트 채팅 리스트 앱을 만들어보자 1️⃣ Data 확인 및 ChatListViewController 만들기 2️⃣ Auto Layout 3️⃣ UICollectionViewCell 만들기 // ChatListCollectionViewCell.swift import UIKit class ChatListCollectionViewCell: UICollectionViewCell { @IBOutlet weak var thumbnail: UIImageView! @IBOutlet weak var nameLabel: UILabel! @IBOutlet weak var chatLabel: UILabel! @IBOutlet weak var dateLabel: UILabel! // Chat.swift 파일에 있..

📌 두번째 프로젝트 버튼을 클릭할 때 마다 랜덤으로 날씨, 온도, 도시가 바뀌는 앱을 만들어보자 Stack View 속에 또 다른 Stack View! 1️⃣ 레이아웃 구성 - Vertical Stack View 속에 label, Image view, label, Horizontal Stack View (이 속에 또 복합적인 View), Button 2️⃣ View Controller 이름 명확하게 바꾸기 - 기존 view controller 파일 지우고, file > Cocoa Touch Class > "WeatherViewController" 이름의 View Controller 만들기 - Storyboard ID? View Controller을 Storyboard에서 찾을 때 사용하는 ID 3️⃣ 화..

📌첫번째 프로젝트 버튼을 클릭할 때 마다 랜덤으로 날씨(=Symbol)이 바뀌는 앱을 만들어보자 1️⃣ 사전에 필요한 다운로드 : SF Symbols 2️⃣ 레이아웃 구성 - Stack View 안에 Image View -> Label -> Button 3️⃣ 기능 구현 코드 // // SymbolRollerViewController.swift // SymbolRoller // // Created by 오예진 on 2022/05/11. // import UIKit // UIViewController = Page를 나타내는 하나의 단위 // UIViewController를 상속받은 SymbolRollerViewController class SymbolRollerViewController: UIViewCon..

2차 심사결과, 아쉽게도 입선까지밖에 다다르지 못하였다..! 🥺 하지만, 초반에는 별로 친하지 않았던 팀원과 백앤드와 프론트앤드를 넘나들며 적으면 한달에 한두번, 많으면 10번 이상 만나가며 끝없는 회의와 코딩을 했던 경험은 너무 좋았던 것 같다. 그닥 실력이 출중하지 않은 내가 처음으로 전공관련 프로젝트에서 팀장이 되었는데, 이런 나와 함께 해주고 같이 맞춰온 팀원이 너무너무 고맙기만하다 ㅠ (입선으로 끝난게 괜히 미안한 마음이 들기도,,) 사실 12월까지 한이음 프로젝트는 계속 진행될 것이다. 아직 과제 결과물에 대한 유사도 분석 및 자동 채점 리포트 생성 부분을 다 하지 못했기 때문에..! 멘토님도 너무너무 좋으시고 우리의 실력과 열정이 사그러들지 않도록 이끌어주신 분이셔서 프로젝트가 이번달 말에서..

사실 이번 한이음 프로젝트에서는 프론트와 백을 동시에 4명이서 배워보자는 취지였기에, 폴더 구성 및 컴포넌트 설계 방식을 정하고 개발을 시작하기 보다는 그냥 구현할 곳을 분배하고 구현하기에 바빴던 것 같다. 어느정도 웹사이트 구현을 마치고, 오늘(2021/09/25) 멘토님과의 미팅에서 이제껏 작성한 코드와 폴더를 살펴보다가 멘토님이 이부분에 대해 이야기를 시작하셨다. 1️⃣ 폴더 구조 실제 현업에서의 리액트 폴더 구조는 다음과 같이 구성한다고 한다. 📁components : 컴포넌트 파일들이 위치하는 폴더 📁adapter : xhr(axios) + socket + websocket 등 📁store : redux 작업을 위한 폴더, 내부에 actions, reducers 폴더 존재 📁hooks : "us..

일단 구현해야하는 화면부터 봐보자! 사진에서 보다시피, drop down 버튼을 누르면 TEAM1의 학생들, TEAM2의 학생들이 팀목록 안에 들어와야 한다! 그리고 이 데이터들은, 이런 형태! 일단 컴포넌트는 두개로 구성되어있다. P07_05.js : Select-Box의 값을 이벤트 객체로 받기 -> TeamList에 team 배열 전달하기 P07_TeamList.js : P07_05.js 로부터 props로 해당 team 배열 받아오고 그 안에 학생들 map으로 돌려서 보여주기 어떻게 구현했는지는 코드로 설명 P07_05.js 코드는 다음과 같다. import React, { useState } from "react"; import { useTeams } from "../../../component..