最初のプロジェクトを終了してから、前の作業内容と手順を振り返ります...

Branchプロジェクト

ココアサービスの著者らのブログサイトBranchでのクローンコードプロジェクトです.
開発者の情報共有ブログは多種多様であるが、開発者の言語の更新と変化に伴い、既存の資料は開発を始めたばかりの初心者にとって参考になりにくいことが多く、Branchの著者申請機能を利用して、開発知識が最も少ない人を選別し、関連認証の文章を露出させ、開発初期読者により正確な情報を提供できるブログ記事を収集したWebサイトにコンセプトを設定します.

開発者と期間

開発期間:2021、11/29～2021、12/10
フロントエンド開発者3名
バックエンド開発者3名
応用技術と実施機能応用技術
Front-End : JavaScript, React.js, SASS, React-router-dom
Back-End : Django, Python, MySQL
Common : Git, Github, Slack, Trello, Notion

私が実施した機能

Nav

localStorage.getItem()を使用して、ユーザーTOKENの

を条件付きでレンダリングします.

ステータス値True/Falseを使用して

を条件付きでレンダリングし、drawerメニュー領域の外側をクリックして閉じる
ホームページ
値を

のスコアに保存し、スライドボタンをクリックするときにスライド

を一定の長さで移動します.
数字ボタンを押す

スライド番号を押す

を移動します.
アプリケーション

マウスサスペンションアニメーション

Tagは

を実現し、ID値とID値が一致するユーザ情報を検索する

の造形にwindowを加えます.scrollyを使用してボタンをクリックすると上部に移動します

進捗

ホームページ

1주차 진행률
- jsx, scss로 기본적인 메인페이지 구조 작성 [완료]
- 특정 높이값에 버튼 보여주기 [완료]
  - window.scrollY를 활용하여 최상단으로 이동시키는 버튼을 구현하고 버튼 스타일에 ```style={ScrollY < 260 ? { display: 'none' } : null}```를 사용하여 스크롤 높이값이 특정 높이 값만큼 내려오지 않으면 버튼이 보이지 않게 만들었다.
- 가로 이미지 스코롤 기능 [미완성]
  - 가로 이미지스크롤(캐로셀-Carousel)을 만들고 싶었는데 아직 미완성이면서 원하던 기능과는 다소 다른 기능이 만들어졌다.
    원하던 기능은 좌우 버튼으로 3개의 이미지가 이동하고 숫버 버튼으로 한개의 이미지씩 이동하기를 원했지만 다소 다르게 만들어져서 수정해야 한다 ㅠㅠ
    ```style={{transform: `translateX(${-위치값state(기본으로 0) * 슬라이드 버튼 클릭 시 움직일 길이}px)`,}}```
- scss 마우스 hover => 텍스트 및 테두리 색상 변경 [완료]
- 태그 카테고리에 따라 같은 태그를 가진 사용자 데이터를 보여주는 기능 [실패]
- 백엔드와 데이터 주고받아 state에 저장하고 활용하기 [성공]

2주차 진행률
- 가로 이미지 스크롤 기능 [완료]
- 태그 카테고리에 따라 같은 태그를 가진 사용자 데이터를 보여주는 기능 [완료]
- 백엔드와 데이터 주고받아 state에 저장하고 활용하기 [성공]

ナビゲーション&ハンバーガーメニュー

1주차 진행률
- jsx, scss로 기본적인 메인페이지 구조 작성 [완료]
- 기능 구현 [대기중]

2주차 진행률
- 토큰 유무 => 조건부 렌더링 [완료]
- 컴포넌트 구조 변경 / 하위 컴포넌트 생성 [완료]
- 애니메이션 추가 [완료]

一緒にいられる時間

いいチーム、いい雰囲気
私は開発を始めて間もない青少年開発者です.だから、もし私が一人で仕事をしていたら、私は楽しい気持ちで開発者に成長することができますか?疑問がある.今は解決できない問題で悩んでいるかもしれませんが、プレッシャーしか受けていませんが、私のチームを支持してくれる人がいるのは最高です.
疲れていても、助けが得られ、食べ物も分かち合うことができ、短い休憩時間の中で、談笑したり、リラックスしたりできる時間があり、長い時間座ってコードを書くのが難しい時期に休憩を与えることができます.
もっと勉強する時間
選手間の実力差が生じざるを得ない.似たような人とチームを組むとしても、彼らの得意分野は異なり、投入時間も異なるので仕方がありませんが、これらの困難を克服するのはチームメンバーです.
知らないことがあれば、探すことを基礎にしますが、探すだけでは問題を解決することはできません.その时、队员は私にどうすればいいか教えてくれた.恐れ入ります
私が使っているコードを見て、もっと短いコードを書く方法を教えてくれて、他の方向性も指摘してくれました.つまり、これは私が知っている知識とは異なる知識であり、私の知識を磨く良い時間でもあります.

記録するのが私のです。

プロジェクトが終わってから記録の重要性を感じました...
コミュニケーションを重視し、多くの会議と仕事の間の問題が行き交い、理解していることも多いが、ほとんど記録されていない.記録の習慣がまだ足りず、新しいものを勉強したり使ったりするのに時間がかかりすぎてコードを書くだけで、今コードを見てみると、記録がないので思い出せないものもあります.
完全にそれを私のものにすることは不可能だと思います.記録して、後でもう一度探して、もう一度過程を理解して、私のものを繰り返しますが、この点では記録していません.これは大きな問題です.
他人のコードを読むのはそんなに難しくない.いろいろと連携した基礎設定をすると、本来の書き方が出てきたり、コードを書くのがとてもきれいな人もいますが、そうでない人もいます...他の人のコードを見てきれいだと思った私は後者かもしれません.
つまり、他人が作った内容が言葉で説明されていて、自分の目で見ても分かりにくいということです.当時参考にしていた資料も一緒に整理しておけばさらに助かり、残念に思います.

今すぐ記録しましょう。

スライド機能
propsで受信したデータの不変性を保つためにspred構文を用い,画像が多ければ21個以降から切り出す.
左右のキーをクリックすると、+3の増分でステータス値が変更されます.

実際には、スライドを移動させるロジックはサブコンポーネントで実現されています.スライド機能を検索すると、多くの方法が見つかりました.私が使用している方法は、次のとおりです.
propsで受信した1枚のスライド画像は、サイズ320 px、初期値0の左右のキーをクリックするごとにスライドSizeを+-3に変更し、320に320を乗じた移動スタイル属性に適用します.

どうしようかな？

2種目目から2日しか離れていない場合、何ができるのでしょうか?実は今は時間が足りないと思って、すべてを整理しました.正直、休みたいし、家事も積み重ねなければならないし...
それは短時間ですべてのことをする考えを放棄して、簡単に.本当に簡単に手帳に記入して写真を残して少しずつ整理していきましょう2つ目のプロジェクトが始まるとやるべきことがたくさんあるので、当日学んだことをしっかり覚えて、残りの時間がまだ整理されていない内容をひとつひとつ整理します.
同じ間違いを繰り返さないで!