后端开发教程 - Java、Spring Boot 实战 - msg200.com
作为初级开发人员（第一个月）我学到的 10 件事
2021 年 2 月，我开始了我的第一份编程工作，担任兼职初级 React Native 开发人员！(🎉)
这家公司名为WorkoutMe，它的 iOS 应用可以让世界各地的人们一起进行实时健身。（想想 Zoom，不过是用来锻炼的。💪）
第一个月我经历了很多模糊的发现，所以我想花点时间记录下那段时间我学到的一些东西。
我学到的十件事
1. React Native
2.入职事宜
3.代码检查
4. 15分钟故障排除规则
5.跨工作流命名约定
6.正在进行的进度清单
7.追踪时间：生产与学习
8. Jetbrains PHPStorm IDE
9.使用别名导入
10.结构化数组/对象数据
1. React Native
有趣的是，在这份工作之前我从未使用过 React Native。😲
我确实对进入一个仅限移动设备的环境和一种看似全新的语言感到紧张。
（我之前曾广泛使用过 React，但 Web 编码和移动应用程序编码之间存在许多差异。）
为了做好准备，我阅读了React Native 文档并购买了深入的React Native Udemy 课程，目前我仍在学习中。
发现💡
我通过“工作”学到的东西比通过 Udemy 课程学到的还要多。
通过尝试解决项目特定的问题，我能够有针对性地阅读文档。这实际上让研究变得不那么令人不知所措。
课程仍然是有益的，但我现在开始用它们来“填补空白”。
2. 入职事宜
我非常感谢 WorkoutMe 的入职流程，因为我觉得它为我的成功奠定了基础。
发现💡
每个项目都旨在逐步向我介绍应用程序的不同部分。
项目 1：
将所有硬编码的前端文本移至 JSON 文件，并使用本地化辅助函数引用它们。（用于未来支持多语言。）
这让我有目的地审查了代码库中几乎每个主要组件。因此，之后的编辑看起来都十分熟悉。
项目 2：
更改多个入职屏幕的布局以使用按钮而不是交互栏。
这让我接触到了 React Native 的核心组件，比如<View>和<TouchableOpacity>，而不用担心创建新的逻辑。
项目 3：
根据提供的设计从头开始创建多个屏幕，并让它们显示来自后端的数据。
这让我了解了更复杂的 RN 组件，<SectionList>并需要新的前端逻辑来处理后端用户数据。
我仍然有很多时候会想：
我到底该怎么弄这个？ 🤔我连模拟器都用不了。还有……模拟器又是什么？ 🥲
很棒的是，每次项目的pull request都会收到导师的建议和修改。他的反馈非常宝贵，帮助我学习并正确地开始下一个项目。
3. 代码检查
在我第一次审查 Pull Request 时，我的主管看着我的代码笑了笑，说：“你的编码风格和我们不一样，你用过 linter 吗？ ”这是一种非常委婉的说法，相当于说“你的代码一团糟”。😂
他向我展示了如何安装ESLint，它可以在我编写代码时进行分析并强制执行特定于 React Native 的最佳实践。
发现💡
我的大部分代码都被红色高亮了！我震惊地发现，它与我的新团队使用的标准竟然如此不同。
我很快就爱上了 ESLint。它确保我们所有人都使用双倍空格进行缩进，对空格进行警告，甚至简化了我的一些代码。
我的下一个目标是了解它捕获了什么，并开始养成以这种风格编码的习惯，并首先避免这些错误。
想要了解更多？
4. 跨工作流命名约定
说到保持一致......
发现💡
无论平台如何，每个问题/功能的名称都是相同的。
1 — 我们的项目管理软件Jira中添加了一个新问题/功能，并赋予了代码和名称。
示例：DEV-120 入职屏幕
2 — 在 GitHub 中，还创建了一个名为 的分支dev-120-onboarding-screens。
3 — 每当我向该分支提交时，我都会以代码开头每条消息。
git commit -m "DEV-120 Add button layout"
4 — 最后，当我跟踪这个项目的时间时，我可以在时间表中包含此代码。（我将在下面详细讨论这一点。）
所有这些都有助于在多个平台和团队成员之间保持清晰的沟通和组织正在进行的工作。
了解有关提交消息的更多信息
5. 15分钟故障排除规则
我有时会遇到从未听说过的错误，或者连谷歌都找不到错误信息的故障。我很容易就花了几个小时去尝试解决它们。
在一个项目中，我花了一个多小时试图弄清楚如何使进度条具有渐变性。
事实证明，这与我们正在使用的包装有关，这是一个非常复杂的事情，我们的设计师实际上同意我们只使用纯色。
发现💡
重要的是不要纠结于单个问题，而是稍后再询问有关这些问题的明智问题。
如果问题需要 15-20 分钟以上的时间才能解决，我现在会写下问题以及我为解决问题所做的事情。
向我的主管寻求帮助可以让他指导我、改变方向或批准我再次尝试。
了解更多关于如何避免陷入错误
6. 正在进行的进度清单
我在做项目的时候，难免会遇到一些问题需要咨询我的主管。我们两个工作地点在不同的时区，所以他并不总是在线，无法及时给我反馈。
发现💡
在问题和建议出现时就记录下来，而不是等到轮班结束时再记录，这样会更快。
每次我完成一个主要功能、遇到一个复杂的错误或有建议时，我都会把它添加到一个编号列表中。这样，我就不用在写几个小时的代码后才记住所有要点。而且他也能根据需要轻松地针对具体问题做出回应。
例子：
// List To Supervisor
1 — Pushed list change progress to branch DEV-82.
2 — Is it important that the dividing lines have space on the ends or can they go to the end? (Screenshot)
3 — Do you know if there is a way to apply shadows to a single group of items in a <SectionList>? I couldn't find anything in the docs or after googling around for a bit.
4 — Currently the video button just has a generic function that runs a console log. At this point did it need to anymore?
5 — Should I break-up the code in <AwesomeListComponent> into sub-components or is it fine as is?
// Supervisor Response
1 — Great.
2 — Yes, please add the space at the ends.
3 — Let's actually move away from using the shadow. Here is a different approach from the designer.
4 — This works for now.
5 — Let's keep it to one component for now.
7. 追踪时间：生产与学习
我发现使用一种名为Harvest的工具来追踪我的时间非常有帮助。
发现💡
用两个不同的时间段来记录时间。一个时间段记录编码的时间，另一个时间段记录学习的时间。
感觉自己花了一整天时间学习教程，却几乎没有完成任何“真正的工作”，这可能会让人有点沮丧。但通过追踪时间的流逝，我也能追踪自己的进步。
在我工作的第一个大项目中，我竟然花了81% 的时间在教程和研究上，只有19% 的时间用于实际可交付的代码。
我当时很沮丧，但这也很正常。我之前从未使用过 React Native，也几乎没接触过代码库，所以每一步都需要一些学习。
在我的第三个大项目中，我将65% 的时间花在可交付代码上，而只花了35% 的时间研究解决方案。
看到我花更多的时间为公司创造价值，让我感到更有动力。
8. Jetbrains PHPStorm IDE
我可能会专门写一篇关于这个的文章。不过我只想说，从 Visual Studio Code 切换过来是一次非常棒的体验。
我的主管建议我研究一下 Jetbrains WebStom IDE，因为我们团队就在用它。它能让协作更轻松，而且多年来一直是他的最爱。
我选择了 PHPStorm，因为它具有与 WebStorm 相同的所有功能，并且为与 WordPress 配合使用添加了许多出色的附加功能。
发现💡
开箱即用的 PHPStorm 让我可以花更多时间进行编码，而不是花在使程序运行、提交或正确配置上。
我喜欢内置面板，可以用来操作 GitHub 以及使用 React Native 运行不同的模拟器。所有这些都无需插件，也无需在终端中输入冗长的命令。
我特别喜欢本地历史记录功能，它让我可以恢复文件中所有已删除的代码。它还能一键将大段代码生成 React 组件，也非常酷。😄
9. 使用别名导入
我喜欢学习新的方法来减少代码编写量！😁
发现💡
通过别名导入需要较少的“路径”代码，并且在移动文件时无需手动重构。
常规导入路径
import icon from require('../../../../assets/icons/icon.svg')
别名导入路径
import icon from require('@assets/icons/icon.svg')
基本上，这是 Webpack 的一个小配置功能，您可以在其中指定它应该查找的特定文件夹。
在上面的例子中，我们只需要指定/@assets/，require()Webpack 就会从该目录开始执行路径。我们导入的组件位于 src 文件夹中的哪个位置并不重要。
（这是通过配置设置resolve.alias实现的。）
10. 结构化数组/对象数据
在我过去的项目中，我并不需要真正担心数据是如何存储的。通常我会在一个数组中存储一堆统一的对象。每个对象都有一个唯一的标识符id，以及一些我想在应用中使用的数据。
const DATA = [
{
id: 'asd',
name: 'Gedalya Krycer',
hobby: 'Hiking'
},
{
id: 'dsa',
name: 'Graciella Krycer',
hobby: 'Writing'
},
•••
]
发现💡
在数组和对象中构造数据时，花点时间考虑它将在何处使用。
以组件为例<SectionList>，它允许您通过数据进行“映射”并创建元素分组。
在这些分组之间，你可以添加一个标题。想象一下，一个表格每隔几行之间就会有一个加粗的绿色标题行。
为了实现这一点，数据数组需要为每个组创建一个对象。在组对象中，它存储一个title键/值对和一个data数组。
保存title了该标题中的信息。
其中data包含主要部分中的信息。
const myData = [
{
title: 'This is the headline',
data: [
name: 'Peter',
phone: '(012) 345-6789',
],
},
{
title: 'This is a different headline',
data: [
name: 'Jill',
phone: '(987) 654-3210',
],
},
]
如果没有这种特殊的格式，就无法正确呈现信息。
感谢阅读！
这就是我作为初级开发人员工作第一个月学到的 10 件事。
我希望你能学到一些重要的东西......我不需要第一天就了解编码的所有内容。
在项目过程中有很多学习的机会。在导师的悉心指导下，我花时间练习，并且经常在谷歌上搜索，这让我每天都在进步。
所以我鼓励你继续申请，争取那些你感兴趣的工作。你可能比你想象的更适合。👍
如果您对有趣的锻炼感兴趣，请查看iOS 版WorkoutMe。🏃
文章来源：https://dev.to/gedalyakrycer/10-things-i-learned-as-a-junior-developer-first-month-4d6h