一周小计(1):实习初体验

news/2024/7/8 6:12:21 标签: 前端

实习的第一周,从最开始的配环境做好准备工作,到拉项目熟悉项目,然后自己去写需求,每一步都有很大收获,以下是个人这几天的记录与感想。(这个其实是我写的周报,记录的也不太详细,有些也是别人帮助我解决的没有记得很清楚,下周一定好好做笔记呢~)

一、技术环境搭建与配置(前提基础)

环境配置
首要任务是下载并配置VS Code,安装Node.js,以及配置yarn和PNPM作为包管理器。

//1. 安装node
https://nodejs.org/zh-cn/ //官网下载
node -v npm -v //检查版本
npm config set registry https://registry.npm.taobao.org//配置镜像源
//2. pnpm
npm install -g pnpm@版本号
//3. 切换node版本
n //查看已安装的node 版本
ls //查看已安装
上下键选择要使用的node版本
//4. 必备插件
Auto Rename Tag //自动同步修改闭合标签
EsLint //语法纠错
Prettier - Code formatter //格式化代码
File->Preference->Settings输入Auto Save选择afterDelay //自动保存代码
vue3-snippets-for-vscode //clg快速log输出

感想

  • 环境搭建是基础工作,熟练掌握git的一些常用操作,利用好google和chatgpt来辅助开发,做好准备工作。
  • 但是搭环境的时候node跟pnpm版本不匹配导致项目运行不起来,解决办法让别人帮你。。

二、Git操作练习与项目熟悉(版本控制与协作)

熟悉Git的操作
从GitLab上克隆了公司官网项目,并通过创建本地分支进行了一些小修改的尝试,把代码push到远程,成功远程部署到jenkins。

项目熟悉
通过阅读项目代码,大致理解官网项目的架构和业务逻辑。

* git clone git@xxxx //克隆项目代码到本地
* git checkout -b cgd //创建并切换到新分支cgd
* git pull --rebase //将远程分支的最新提交合并到本地分支
* git add . //将要上传的所有代码存到暂存区
* git commit -m 'xxx' //提交的信息记录
* git push --force-with-lease //强制推送(force push)本地分支到远程仓库
* git rebase cgd //将当前所在分支的提交历史重新定位到cgd所代表的提交或分支的顶部
* git cherry-pick 123234 // git cherry-pick id .将指定提交(通过其哈希值或commit ID标识)应用于当前分支上,而不是合并整个分支.
* git log //可以查看以前的记录 查看ID
* git merge dev //合并

感想

  • 工欲善其事必先利其器,先牢固掌握好基础和一些方法,不要贪图新的知识,个人职业规划详细思考。
  • 利用好AI辅助未尝不是解决问题的给力工具,真的挺方便。
  • 个人的思维方式,遇到问题只是表面解决了,后面要透过现象看本质,通过不断追问“为什么”,剥离表象,直达问题的核心,然后从这个核心出发构建解决方案。

三、官网首页改版(实战)

首页Banner修改
英文和中文的文案均缩短,自动滑动速度再慢一点。(这个就是检查位置在哪,然后改掉a-carousel的autoplaySpeed)

添加功能判定
在“申请试用”按钮上添加一个判断逻辑,需要再写一个弹框组件,判定是个人用户还是企业用户,跳转到不同的地方。

<template>
        <AModal
            v-model:visible="visible"
            @cancel="handleButtonCancel"
        >
            <div @click="tolink('individual')">
                <img src="../../assets/imgs/Home/individual_user_role.png" alt="" />
                <span>个人</span>
            </div>
            <div @click="tolink('company')">
                <img src="../../assets/imgs/Home/corporate_user_role.png" alt="" />
                <span>企业</span>
            </div>
        </AModal>
</template>

<script lang="ts" setup>
    import { onMounted, ref } from 'vue';


    const visible = ref<boolean>(false);
    const { $bus, $lenis } = useNuxtApp();


    // 打开与关闭弹窗
    const showButton = () => {
        // 滚动阻塞
        $lenis.stop();
        visible.value = true;
    };

    const handleButtonCancel = () => {
        // 滚动启用
        $lenis.start();
        visible.value = false;
    };

    const tolink(type)= () => {
        if type === 'personal' {
            window.open('http://个人.com/');
        } else {
            window.open('http://企业.com/');
        }
        handleButtonCancel();
    }

    onMounted(() => {
        // 监听事件
        $bus.$on('show:applyButton', () => {
            showButton();
        });
        $bus.$on('close:applyButton', () => {
            handleButtonCancel();
        });
    });

    defineExpose({ showButton, handleButtonCancel });

</script>

感想

  • 第一次体会到了理论知识与实际开发之间的差异,虽然自己有思路怎么做,但是去写的时候找不到在哪以及写了但是为什么这个功能没有实现,掌握到怎么快速查找和输出大法。
  • 有思路不代表会做,自己去写也是有点混乱的,没有彻底理清思路。在遇到问题之前,必须把思路理清,再一步一步来。
  • 语法规范,优美的写代码。

写在最后

  • 下面这一部分我是不会写在周报里面的哈哈哈,就是个人的一点小感受记录了
  • 第一次用mac,真的一点都不懂咋用的,好尴尬啊啊啊,电脑干干净净啥都没有。实习要用mac的小伙伴注意了!提前看一些基本操作!
  • 第一天第二天就配环境拉项目看项目,也还好。但是第三天就给了我两个小小的需求,我好心虚~。怕自己写不出来。果不其然,写的很不顺利,第三天就有点小郁闷了。还好带我的哪个哥人特别好一直在教我!提出表扬!第四天顺利写出来了,又开心了。
  • 第一周刚开始有一个新人介绍会(只是我们组的,挨个自我介绍就好了,大家都很厉害),老大还请我吃新人欢迎餐好感动,谢谢老大!and周会(要写周报,以及要表扬谁我没来得及写好惭愧要感谢很多人都没写)和月会(刚好赶上月末),我是i人啊啊,月会整个研发的都要过来,最后我要自我介绍还有表演才艺,谁懂啊好尴尬,特别尴尬的表演了一个魔术。。不过最后还吃到了一个哥哥的生日蛋糕(好吃 祝他生日快乐)!
  • 最后,在实习期间也会不断学习的,老大还给我搞了学习计划,会更新自己的学习记录~

http://www.niftyadmin.cn/n/5536649.html

相关文章

10分钟完成微信JSAPI支付对接过程-JAVA后端接口

引入架包 <dependency><groupId>com.github.javen205</groupId><artifactId>IJPay-WxPay</artifactId><version>${ijapy.version}</version></dependency>配置类 package com.joolun.web.config;import org.springframework.b…

【物联网工程导论期末复习完整知识点】第一章物联网概论

物联网工程导论第一章 第一章物联网概论物联网发展的社会背景物联网概念的提出物联网与智慧地球欧盟与各国政府物联网产业的发展规划物联网与我国战略性新兴产业 物联网发展的技术背景普适计算的特征CPS主要技术特征 物联网定义与主要技术特征物联网的定义物联网的主要技术特征…

docker介绍与详细安装

1 docker 介绍 1.1 虚拟化 在计算机中&#xff0c;虚拟化&#xff08;英语&#xff1a;Virtualization&#xff09;是一种资源管理技术&#xff0c;是将计算机的各种实体资源&#xff0c;如服务器、网络、内存及存储等&#xff0c;予以抽象、转换后呈现出来&#xff0c;打破实…

Perl 语言开发(五):循环语句

目录 1. 循环语句概述 2. while 循环 2.1 基本语法 2.2 示例 2.3 无限循环 3. until 循环 3.1 基本语法 3.2 示例 3.3 无限循环 4. for 循环 4.1 基本语法 4.2 示例 4.3 嵌套循环 5. foreach 循环 5.1 基本语法 5.2 示例 5.3 遍历哈希 6. 循环控制语句 6.1 …

【unity实战】使用unity的新输入系统InputSystem+有限状态机设计一个玩家状态机控制——实现玩家的待机 移动 闪避 连击 受击 死亡状态切换

最终效果 文章目录 最终效果前言人物素材新输入系统InputSystem的配置动画配置代码文件路径状态机脚本创建玩家不同的状态脚本玩家控制动画优化&#xff08;补充&#xff09;闪避手动优化受伤和死亡同理 源码完结 前言 前面我们已经写过了使用有限状态机制作一个敌人AI&#x…

kubernetes service 服务

1 service作用 使用kubernetes集群运行工作负载时&#xff0c;由于Pod经常处于用后即焚状态&#xff0c;Pod经常被重新生成&#xff0c;因此Pod对应的IP地址也会经常变化&#xff0c;导致无法直接访问Pod提供的服务&#xff0c;Kubernetes中使用了Service来解决这一问题&#…

SHELL脚本学习(十三)初识 gawk 编辑器

概述 gawk提供了一种编程语言&#xff0c;而不仅仅是编辑器命令。 在gawk语言中&#xff0c;可以实现如下操作&#xff1a; 定义变量保存数据使用算数和字符串运算符处理数据使用结构化编程概念 为数据处理添加处理逻辑提取文件中的数据并将其重新排列组合&#xff0c;最后生…

Flume集群部署(手把手部署图文详细版)

前景概要&#xff1a; Kafka消息订阅系统在大数据业务中有着重要运用&#xff0c;尤其在实时业务中&#xff0c;kafka是必不可少的组件之一。 Flume是大数据组件中重要的数据采集工具&#xff0c;我们常利用Flume采集各种数据源的数据供其他组件分析使用。例如在实时业务中&…