100DaysOfCode
1.0.0
歡迎來到我＃100天的代碼日誌，因為我在接下來的100天內至少每天至少一個小時的代碼挑戰！我正在通過啟動代碼學校的完整堆棧Web開發訓練營來加入勇敢的學習如何進行編碼的新世界。這是未來四個月的全職工作，但也是免費的。申請過程很長，但代碼學院僅接受了我的隊列4000名申請人中的3％。我如何拒絕機會？ #careerchange #womenintech
今天的進度：學習新的CSS選擇器並在與CSS Diner配對時練習它們
鏈接工作：CSS Diner
想法：在我在代碼學校的第一天都做到了這一點。創始人兼首席執行官克里斯·梅（Chris Meah）今天告訴我們，代碼學校的更準確的名稱是“技術職業生涯密集的合作創意問題解決者的入職”。我很高興能開始學習與所有這些新朋友進行編碼的旅程！
今天的進度：
鏈接工作：破解銀河系
今天的進度：
今天的進度：
今天的進度：在我們的第一屆Code Hackathon學校中，整天都在#JavaScript和#Problembrobles進行了#Problemsolving。我們從頭開始建造了岩石，紙，剪刀遊戲。
思想：我喜歡這種吸引人的代碼黑客馬拉松曲調，它使我們所有人都開除了當天的活動 - 黑客馬拉松星期五。
今天的進度：今天，我學會瞭如何在Github分叉。然後，我分配了一周與配對伴侶進行的研討會。我們在一周內還沒有完成它們，所以我分叉了，以便我可以獨立地對其進行工作。
今天的進度：為周末的作業工作，這是一個GitHub回購，涵蓋了JavaScript上的所有主題，我們在第一個星期在Code的第一周就教授了。
今天的進度：
今天的進度：
思想：除了“與計算機一起使用”以外，我開始了解程序員的作用。 ？
今天的進度：
今天的進度：
今天的進度：
今天的進度：在www.w3schools.com上進行了研究和完成的練習。
鏈接工作：W3Schools JavaScript教程
今天的進度：開始在RECAP第2週的研討會上工作，該研討會涵蓋了功能，字符串，循環，陣列，SetInterval，Clear Interval和Fetch。
今天的進度：
思想：我今天的鼓舞人心的報價。看到了這個，當我開始編碼訓練營第3週時，這對我來說是完美的。您將勇敢地吸引什麼新事物？
今天的進度：
今天的進度：
用戶界面（UI）設計：
CSS：
今天的進度：
今天的進度：昨天是星期五在法典學校的黑客馬拉松。我們使用新開發的UI/UX技能來設計業務登陸頁面。我們一起工作：
今天的進度：
使用代碼學校的JavaScript回顧研討會繼續編碼功能，循環和數組。
我喜歡的眾多代碼學校之一是，他們將每個人與一位已經在科技行業工作的導師聯繫起來，並且願意每週1：1與我們見面。亞瑟（Arthur）是我的導師，他已經通過他的技巧，建議和支持來鼓勵我。今天早上，當我感到沮喪的時候，他給我發了一句鼓舞人心的報價，我整天都在向自己重複。謝謝你，亞瑟！
#javascript #mentoring
今天的進度：
今天的進度：
本週，我們正在學習有關後端發展的知識。我們正在使用nodejs（開源JavaScript運行時）在瀏覽器外運行JavaScript。
#nodejs #backenddevelopment #json #expressjs
今天的進度：
今天的進度：
今天的進度：Hackathon星期五在法典學校建造後端。從頭開始構建REST API。設置CRUD路線，並使它們在我們的路由器中運行。創建模型功能並將其傳遞給路由器中的路由處理程序。
今天的進度：上週我與編程對合作夥伴一起使用Node.js和Express構建REST API的工作坊的回購。這次是一個人從頭開始再次做到這一點，以加強我學到的東西。
今天的進度：本週，我們正在學習編程語言，SQL。
今天的進度：
今天的進度：今天，我們學會瞭如何將庫連接到數據庫。
今天的進度：
今天的進度：星期五在法典學校舉行的黑客馬拉松！在三人組中共同努力，我們：
今天的進度：
今天的進度：本週我們正在學習有關測試和現代軟件工程實踐的知識。我們已經了解了Jestjs.io，測試驅動的開發（TDD）和Cypress.io。
今天的進度：
今天的進度：
今天的進度：
鏈接工作：免費代碼訓練營
今天的進度：
今天的進度：
今天的進度：
今天的進度：
今天的進度：
今天的進度：
想法：每天在午餐休息時，我都會嘗試走到外面。這對我的健康非常有用，也被科學證明可以平均增加60％的創意思維！有效解決問題的完美幫助。
今天的進度：星期五在法典學校的黑客馬拉松。我們試圖使用整個星期都學習的ReactJ中的技能來創建一個“待辦事項列表”應用程序。我和我的配對夥伴決定我們需要回去了解一些反應的基本知識，例如州和道具。結果，我們花了一些時間瀏覽Net Ninja的YouTube播放列表，完整的React教程並討論它，以確保我們理解它。
今天的進度：
今天，我學會瞭如何將您的＃100DaysofCode log轉換為視覺體驗，這要歸功於這篇免費的代碼訓練營。
隨後，我使用圖像，鏈接和格式化更改了此日誌，並在Markdown代碼的幫助下進行了更改，例如：
斜體
大膽的
關聯
blockquote
與背景Inline code
# code block
print '3 backticks or'
print 'indent 4 spaces'
鏈接到資源：
Markdown教程
Markdown教程和視覺工作室代碼
想法：經過一個激烈的一周之後，當我生病時，我試圖學習如何使用React Js來編碼，我需要心理休息。我發現它令人鼓舞和激勵學習如何改善#github上的＃100DaysofCode登錄，以使閱讀更有趣。這些日子之一我希望發布一些實際的項目，但現在這是一個很好的第一步。 Code First Girls的這句話正是我今天需要閱讀的內容：
當今的進度：了解ReactJ中的純函數，例如使用效果鉤。如何使用fetch，usefect和usestate從API獲取數據。
今天的進度：
了解GIT中的分支機構管理。這包括學習一些新的git命令，例如：
git結帳–b添加到遠程。這將創建一個名為“添加到示例”的新分支，並同時切換到它。
Git Checkout Main。
git推動 - 上游起源NewBranchName
我們還了解了UserDucer，這是一個掛鉤，可讓您在要控制所有內容時管理React中的狀態。
今天的進度：
與Code UserEducer研討會的用戶編者重新分配了列表
與我的配對合作夥伴一起在代碼大戰中解決了6kyu kata。
在下週為我們的小組項目做準備時，請刷新測試代碼。
然後在React組件測試研討會上工作。
了解創建React應用程序。 React測試庫。
今天的進度：
了解更多有關敏捷工作，看板董事會，敏捷的衝刺迭代，MSCW的信息（必須擁有，應該擁有，可以，不會有）。 ETC。
有關測試反應組件的更多評論。
我們還進行了以下主題進行並介紹了小組研究項目：
今天的進度：繼續在freecodecamp的JavaScript課程中完成課程
鏈接到工作：JavaScript算法和數據結構認證課程
今天的進度：繼續在FreeCodeCamp的JavaScript課程中努力工作
鏈接到工作：JavaScript算法和數據結構認證課程
今天的進度：
本週在代碼學校的本週，我們被列為四人一組，並要求設計一個完整的堆棧Web應用程序，該應用程序有助於應對訓練營所面臨的挑戰，同時學習遠程學習。在本週結束時
本週我們的目標之一是在我們計劃，管理，開發和介紹我們的應用程序時使用敏捷軟件開發實踐。因此，作為一個團隊，我們首先同意我們的團隊宣言核心項目和恢復策略。然後，我們使用Jamboard和Disney Iseation方法來集思廣益，然後將其縮小。我們還完成了無花果上的用戶故事，組件樹和低保真線框。
在開始使用代碼學校的一天之前，我觀看了Net Ninja的YouTube教學視頻，介紹了Ninja和React（使用JSON Server和使用效應依賴關係）。
今天的進度：
今天，我們在Trello上創建了一個看板董事會，以實現項目管理。然後，我們湧入編程對，一對開始構建前端，另一對在後端上工作。
對於後端，我們畫了一個圖表，顯示了數據庫所包含的表以及它們如何加入。我們還為後端處理的請求寫了一個API計劃表。然後，我們在Railway.App中創建了一個PostgreSQL數據庫
思想：
這是非常壓力的一天。我們昨天在團隊中發生的摩擦今天變得更糟。我們的一位同事與其他團隊的其他成員並不吻合，我們發現自己花費了太多的精力表達了為什麼我們以前做我們同意的事情，試圖朝著推動推動的力量推動。下午一半，它變得難以忍受，我們的團隊達到了一個突破點。
今天的進度：
當今的挑戰之一是連接我們開發的前端和後端。我們最終下載了一個名為CORS的Node.js軟件包，該軟件包提供了明確的中間件並調整我們的React組件以適當響應。
我們在異步功能中也有一個控制台。log使我們暫時拋棄了一段時間，直到我們注意到我們需要將其移出。
我們確實設法使兩個組件正常工作。
思想：
今天，我們從團隊將會發生的事情開始時從不確定性開始。我們繼續作為三重奏工作，但我們仍然有些丟失，因為在事情正在積極變化時很難進行。
直到下午中旬我們正式收到法規學校的決定，從那時起，我們將成為三人一組。我們顯然落後了，但是這種確認給了我們我們需要的確定性。在整個下午的剩餘時間裡，我們三個人都重新評估了我們的情況，重寫了我們的恢復計劃，並開始重新考慮我們的最低可行產品（MVP）定義。
今天的進度：
今天早上，在我們日常的站立式上，我們決定在一天結束時我們的目標是讓我們的應用具有一個模塊化的儀表板，並具有清晰的部分，並且在視覺上結構良好。我們必須為我們的原始計劃做出一些犧牲，以便在一天結束時達到經修訂的MVP，例如：
修改了MVP後，我們提出了一種配色方案，修改了我們的低保真線框，並使用Trello上的看板董事會討論了我們對任務的優先級和責任。
今天，我了解瞭如何將CSS用於對樣式組件的反應，並喜歡從編碼中看到立即的視覺結果。
在本週的每一天結束時，我們遇到了回顧性，使用4LS技術討論了我們所愛，討厭，渴望和學到的東西。
今天的進度：
今天，我們的重點是將我們的應用程序準備並呈現給該行業的法官小組。
我們的解決方案是一個儀表板，可幫助訓練訓練訓練板在進行激烈的學習一天后進行解壓縮。它有按類別組織的活動，有助於促進健康。您可以每天添加它，並根據自己的目標查看進度。它也有一個隨機的笑話生成器。最後，有一個提示寫下您對您過去所感激的東西的列表的感謝。
使用的工具： Jamboard，Figma，Trello，Vscode，Git，Github，Zoom，Google Docs和Google Slide
技術堆棧使用： JavaScript ES6，Node.js，Expres.js，React.js，PostgreSQL（ElephantsQL和Railway.App），HTML和CSS
思想：
本週我們不可避免地遇到了挫折，然後當我們已經落後時，我們成為了三人組。之後，儘管我們的團隊較小，但我們還是一支凝聚力的團隊，慶祝我們的勝利多大，而我們的生產力水平在屋頂上拍攝。
對我們來說，最大的收穫是，在面對團隊挑戰時，心態和積極的態度是多麼重要。我們有一個獨特的機會體驗在真正的工作環境中可能面臨的障礙類型。對我們來說，繼續前進並保持敏捷非常重要。
本週，我們從敏捷宣言中汲取了以下值：
我非常感謝我對這個項目的隊友，Gabe和Milly。他們支持，鼓勵，善良，靈活，有韌性，並且在編碼方面也很出色！我們面臨著巨大的挑戰，但克服了它們，並以積極的態度作為一個凝聚力的團隊。在本週結束時，我們向法官提交了一個運行的應用程序，該應用程序幾乎完全在一天之內編碼。多麼的成就！
你們對軟件設計的基本原理和軟件開發生命週期的基本原理表現出了深刻的了解。
在艱難的一周中取得積極的狀態真的很好。
不幸的是，鑑於他們在團隊成員方面遇到的問題，但仍然對該項目進行了令人印象深刻的發展。
自然，您的最終產品比我們看到的其他產品的發達效果還不那麼發達，但是當我們考慮到您本週遇到的麻煩（完全不可避免！）時，這絕對是可以理解的，儘管您所做的事情對本質上的工作確實給人留下了深刻的印象。
今天的進度：在SOC今天早上開始之前，我在Reactjs文檔中閱讀了有關州的文檔，以增強我的理解。
在今天的《法規學校》中，我們上週從項目組中度過了一個早晨，他們進行了Sprint的回顧。我們創建了一個Trello董事會，以討論進展順利，需要改進的方法以及未來的行動項目。我還學會瞭如何為Trello卡添加投票選項，以便我們可以對我們想在列表中看到的三個想法進行投票。
下午，我們專注於代碼評論。我們閱讀了代碼審查指南，然後與上週的另一個團隊會面，以審查其代碼（反之亦然）。
鏈接到一些使用的資源：
狀態：組件的內存
來自Atlassian的回顧性基礎知識
今天的進度：今天，我們根據昨天從同行代碼評論中收到的反饋來開始對項目中的代碼進行一些更改。
思想：我今天真的很喜歡，覺得自己學到了很多東西。當我們審查代碼時，我試圖向隊友大聲解釋代碼在做什麼。我的隊友擅長解釋我不明白的任何事情。他們還幫助我開始使用正確的語法。我經常理解並可以解釋代碼的邏輯，但不記得正確使用的技術詞（例如“渲染組件”）。
資源的鏈接：用於添加文檔註釋的JSDOC工具和Readme Markdown編輯器
柏樹測試我們應用程序的組件： 
GitHub網絡圖：我們的提交： 
今天的進度：上週從我們的小組項目中創建了README文檔為前端和後端存儲庫。在代碼中為前端和後端存儲庫編寫JSDOC評論。當我們再次瀏覽代碼時，最好回顧一下我對每個部分如何連接並與從正面到後端的其他部分進行通信的理解。
今天的進度：今天，我們了解了身份作為服務（IDAAS），這是由第三方提供商構建和運營的基於雲的身份驗證。 IDAAS提供商的示例是Auth0，AWS Cognito，Firebase和Supabase。下午，我開始嘗試在一個React項目的前端設置身份驗證。我使用Autho0將以下功能集成到單頁React應用程序中：
今天的進度：今天我繼續從事昨天的項目。我學會瞭如何調用驗證Ourjson Web令牌的API。 The aim was to get our user's metadata to display on the page and we managed to do it!
Next, we worked on protecting the backend of our React project. We created an API that supports the following routes:
It took ages to figure out how to get the last one (private-scoped) to work but we finally managed to find and tick the right boxes in the Auth0 API settings to get it to work (hint: check the Machine to Machine Applications tab).
In the last few minutes of the day, I built a React app from scratch that uses authentication via Auth0. The one bit I haven't figure out yet is how to code it so that you can only access the app once you have logged in. Right now it's showing on the main page and also when you log in. Will tackle that problem another day.
Today I also added a demo video to the README files for our week 9 Group Project: Globally Scoped Project Frontend and Globally Scoped Project Backend
Today's Progress : Learned and practiced how to deploy React app projects via Netlify.
Today's Progress : Learned and practiced how to deploy a backend environment using Render. Then deployed the related frontend (a React app shopping list) via Netlify.
The highlight for me today was learning how to set up my React App from last Friday (2 Dec) so that the user has to log in first before they had access to the app, their user info and their user metadata.
To do this, we leveraged the Identity as a Service (IDaaS), Auth0 React SDK. It is a JavaScript library for implementing authentication and authorization in React. We used the useAuth0 hook in our components to access authentication states such as (isAuthenticated and user), authentication methods such as logout, as well as the logical conjunction (&&) operator to do it.
In the morning I also completed some katas on Code Wars with my pairing partner for an hour. We started going through Katas list of Training JS series together.
Today's Progress : Today we learned about a React Hook called useContext that lets you read and subscribe to context from your component.
Links to resources : React Hooks: useContext and Passing Data Deeply with Context
Today's Progress : This morning I completed a CodeWars kata with my pairing partners. Then we worked on completing the workshop from yesterday on custom hooks.
In the afternoon, we learned more about Couchbase. Couchbase is a DataBase as a Service (DBaaS) provider.
Today's Progress : Hackathon Friday at School of Code. Our challenge was to ideate, plan, and build a full stack app that included:
It was a huge challenge to do in just 5 hours. We managed the first task and had started on the second one when it was time to present at the end of day.
Thoughts: How do you maintain motivation to keep going when you are worn out? After twelve weeks of intensive learning with the School Of Code boot camp, I took the advice that Women In Technology (WIT) shared below so I can press on to keep going in my #100daysofcodechallenge.
Today's Progress : We started learning about TypeScript today. Here's a little code snippet from the first part of our workshop practicing writing in TypeScript:
代碼片段
/* TASK 1.1: declare and initialize a boolean variable */
let isTrue : boolean = true ;
/* declare and initialize a string variable */
let myName : string = "Stephanie" ;
/* declare and initialize a number */
let myAge : number = 32 ;
/* declare and initialize an array of booleans */
let isVeryTrue : boolean [ ] = [ true , false ] ;
/* declare and initialize an array of strings */
let stringArray : string [ ] = [ "2" , "b" , "6" ] ;
/* TASK 1.2: Declare and implement a function which takes in two numbers and
returns their sum.*/
function totalSum ( a : number , b : number ) {
return ( a + b ) ;
}
console . log ( totalSum ( 2 , 8 ) ) ;
/* TASK 1.3: Declare a new type that describes an object containing the keys and
types below:
amount: a number
uniqueId: a string
isValid: a boolean
addressLines: an array of strings */
type Data = {
amount : number ;
uniqueID : string ;
isValid : boolean ;
addressLines : string [ ] ;
} ;
function getData ( personalData : Data ) {
return personalData . uniqueID ;
}
console . log ( getData (
{
amount : 15 ,
uniqueID : "Sam" ,
isValid : true ,
addressLines : [ "1 Park Lane" , "2 Falcon Way" ]
}
) ) ;
/* TASK 1.4: Declare a new type which is any one of: "BLUE" or "YELLOW" */
function setColor ( color : string | string ) {
return "My favourite color is " + color ;
}
console . log ( setColor ( "BLUE" ) ) ;
console . log ( setColor ( "YELLOW" ) ) ;Today's Progress : Learned how to convert React JavaScript to TypeScript. Spent the day with my pairing partner converting all the .js components of a “to-do list” React app to .tsx components.
Today's Progress : Today we learned how to use VS Code to debug code. We also learned a bit more about how to code using TypeScript.
Tomorrow I have a progress interview. Therefore, I also took some time to review the code from our week 9 group project to make sure I understood it. My programming pair partner for this week, Beatrice, was kind enough to let me practice explaining it to her. She asked me some good questions about it too.
In the evening I met with my mentor, Arthur, and he helped me review and practice answering common interview questions that someone might be asked when interviewing for a software development job.
Today's Progress : Hackathon Friday at School of Code. With our programming pair partner our challenge was to build a weather checker app using Typescript and React. The user needed to be able to input the name of a city and have weather information about that city added to the page.
We first made a plan then created a component tree diagram in Miro before we started any coding. I had my progress interview in the middle of the day so Beatrice did a large chunk of the coding during the 1 1/2 hours that I was away for my interview.
In the last bit of time we had at the end of the day we managed to add a background image and weather icon which reflects the city's weather.
Today's Progress : Continued to work through more of the Free Code Camp curriculum for the JavaScript Algorithms and Data Structures Certification. Also started watching Dave Grey's Node.js Tutorials on YouTube.
Link(s) to work : JavaScript Algorithms and Data Structures Certification
Link(s) to resources : Node.js Tutorials
Thoughts: I have now completed the first twelve weeks of the School of Code (SoC) boot camp. When I started, the only coding I knew how to do was some basic Python from the Code First Girls intro course I took last summer. I didn't know any JavaScript, HTML, or CSS. I didn't know how to use Git or GitHub. I had never heard of a PERN Stack much less how to code using PostgreSQL, Express, React, and NodeJS. In these past twelve weeks, we have been taught a massive amount and I've worked incredibly hard - day, night, and every weekend. It's amazing how much I have learned and grown in just three months.
I still feel so behind though in my comprehension and was feeling quite discouraged yesterday. However, Bee helped me gain some perspective by pointing out that before our SoC boot camp started, she spent two months going through some Udemy courses on JavaScript (while also working). At our SoC bootcamp we only spent 3 days learning what she had spent a full 2 months learning on her own.
I really enjoyed going through this basic JavaScript course on Free Code Camp today. It's so much easier on my brain. I'm learning things that so many others on my SoC course already knew before they started. Some of these concepts look familiar to me because we have used them in our coding at SoC but I had not learned them yet.
This post encouraged me too:
Today's Progress : This morning David Adams, Site Reliability Engineer (SRE) at ManyPets, gave us a interesting, practical presentation about the Continuous Integration and Continuous Delivery (CI/CD) cycle.
In the afternoon, I met my new programming pair partner for the week and together we started learning more about Amazon Web Services' many products. We created a new AWS account and followed the Amplify with React tutorial to create a full stack application with the AWS Amplify Comment Line Interface (CLI). We didn't have time today to add authentication to the app or deploy and host it but managed to get everything else done from the tutorial.
Link(s) to resources : Amplify with React Tutorial
Today's Progress : This afternoon we did group research projects on Nextjs, Gatsby, and Remix. Each programming pair was assigned one of the React frameworks to research. We later presented to groups who looked at the other two frameworks. My programming partner and I were assigned to research Remix. As part of our research we created a Remix project from scratch. Our group presentations at the end led to some interesting discussions about which framework was better to use depending on your needs.
In the morning I also solved a CodeWars kata with my programming pair partner for this week.
Link(s) to resources : Nextjs, Gatsby, and Remix
Today's Progress : Continuted watching Dave Grey's Node.js Tutorials on YouTube and writing the code along with the tutorial.
Link(s) to resources : Node.js Tutorials
Today's Progress : Continued to work through more of the Free Code Camp curriculum for the JavaScript Algorithms and Data Structures Certification.
Link(s) to work : JavaScript Algorithms and Data Structures Certification
Today's Progress : Continued to work through more of the Free Code Camp curriculum for the JavaScript Algorithms and Data Structures Certification. Also watched more of Dave Grey's Node.js Tutorial playlist on YouTube.
Link to work : JavaScript Algorithms and Data Structures Certification
Link to resources : Node.js Tutorials
Today's Progress : Continued to work through more of the Free Code Camp curriculum for the JavaScript Algorithms and Data Structures Certification.
Link to work : JavaScript Algorithms and Data Structures Certification
Today's Progress : Continued to work through more of the Free Code Camp curriculum for the JavaScript Algorithms and Data Structures Certification.
Link to work : JavaScript Algorithms and Data Structures Certification
Today's Progress : Continued to work through more of the Free Code Camp curriculum for the JavaScript Algorithms and Data Structures Certification.
Link to work : JavaScript Algorithms and Data Structures Certification
Today's Progress :
This month at School of Code we have been put into teams of six people and tasked with designing a full stack web application which solves a real-world problem. The aim of this month-long project is to help us experience what it's like to be part of a real-life engineering team building a practical solution for our end users.
Today as a team we accomplished the following:
Key Principles from our Team Manifesto:
Thoughts:
Today was our first day back after a two-week holiday and the first thing we did was find out who our teammates are for this final project. I have only worked with one of my five teammates (pair programming) before but know some of them as we're in a larger 40 person group (A) on the bootcamp. I am very excited to about our team. They are all great people and we have huge potential.
Today's Progress :
Disney Ideation Method:
User Stories:
The Unique Selling Point (USP) of our app will be:
Now that we had agreed on an idea for our app we decided on a team name: Frugal Fanatics
Today's Progress : Today we began to define our Minimum Viable Product (MVP) and to design a basic low fidelity wireframe based on our requirements.
We also created a Market Research Survey on Google docs. I shared it on LinkedIn, Facebook, and on the School of Code Slack channels to gather as much feedback as possible.
Link to our survey : Frugal Fanatics Market Research Survey
Today's Progress :
We had 74 people complete our Market Research Survey! The results led us to quickly pivot our MVP based on the user feedback.
It showed that the vast majority of those surveyed have increased stress and anxiety as a result of the cost of living crisis. This led us to decide to add a component to the app which would help them, such as a mindfulness element.
Users also indicated that they were keen to have a budgeting tool as well as a tracker for their expenses and saving. However, not many indicated that they needed help with managing debt. So we decided to shelve the debt tracker for the time being.
Today we also finished our low fidelity wireframes.
Today's Progress :
We made final decisions on our Tech stack today, including using relational databases over non-relational. We also decided on our Git branching strategy (GitHub Flow) and practiced it using a practice repo. We will be protecting the main branch and deploying after every sprint. In addtion, we agreed on our colour scheme.
Tech Stack:
Colour Scheme:
Today's Progress :
We finally started coding today!
Team Rota:
Other work we did today as a team:
On the Front End:
On the Back End:
實體關係圖
Today's Progress :
We merged all the front and back end branches this morning so we are moving forward on a uniform copy. With my pair partner for the day I set up the back end to include 3 models and 3 routes connected to the database tables on elephantSQL.
Today's front end teams:
Today's Progress : Today I was working with a different partner on the back end. We debugged and successfully tested GET requests for userRoutes, expensesRoutes, and savingsRoutes via Postman. We also successfully debugged and tested POST for userRoutes.
I drafted the README doc for our back end repo.
We also deployed the back end to Render: Users Table, Expenses Table, and Savings Table
Today's Progress : This morning, with my partner, I finished debugging and testing the back-end GET and POST requests for users, expenses and savings.
We then prepared our group presentation for our mid-month product demos which we showed in the afternoon to everyone in Group A (around 40 people). We received some helpful feedback from the coaches which we will bring into our planning next week.
Today's Progress : Worked on documenting our teams progress since we started, including taking screen shots and recoding videos which demonstrate our app as it is today.
Today's Progress : Today we discussed our goals for our next week-long sprint which starts today. Our top priority is to get the front and back end connected. Right now we have a fully funtional back end with GET and POST requests working. The front end is working too but with dummy data that's been hard coded.
My programming pair partner for today and I worked on cleaning up the code on the front end: breaking down the components into groups and updating the terminology to match the database. At the end of the day, we met as a team of six again and decided that tomorrow morning four of us will work together to agree upon how we want to connect the front and back end so we are not doing separate things (on the front and back end) that don't end up working together.
We are also considering at what stage we will implement authentication - at the start before completing the budget information form, or only after that form has been completed but before displaying the custom dashboard which is populated with data from the completed form.
Today's Progress : Last week, we created a custom Express.js server on the back end and built our front end using the Next.js React framework. We realised this week that there are some challenges with connecting these two. Therefore, today we explored some other options for the back end that would work better with Next.js, such as Supabase. Some of the features that Supabase offers are a Postgres database and authentication. It is also open-source. We spent today discussing, researching and experimenting to determine the best option to use. While I was doing this with a few of my teammates, two others from our group worked together to get the front end deployed on Netlify as well. When we divide and conquer we make great progress together as a team!
Link(s) to resources : Supabase
Today's Progress : Yesterday afternoon we created a test branch off our main front end branch and scaled it down to test whether we could get Supabase working with authentication and our simplified Next.js app. We managed to get it working so decided to go with Supabase + Next.js instead of elephantSQL and Express.js with Next.js. It was easy to quickly replicate our Postgres database in Supabase. Then we started refactoring our code on the front end using Supabase. It's been slow going as it's all new to us. Up to this point, the only authentication that we've learned in the bootcamp was how to use Auth0 as a login for a simple static site. Our app for this project, however, requires authentication and authorization when accessing the database and it's also a dynamic website.
We also spent time as a team today discussing how we can make our app fun and gamefied since that's one of our unique selling points. We have some great ideas which we hope to implement once we finish connecting the front and back ends.
Two of our team worked together today updating the front end to make it accessible. By the end of the day, Google's Lighthouse accessibility audit was showing all green with 100% ratings.
This evening I spent some time reading through documentation on Next.js and supabase so I have a better understanding of how they work. I feel more confident now going into tomorrow.
Tech Stack starting week 3
Accessibility - Lighthouse Audit
Today's Progress : Discussed our goals first thing this morning. Decided to make dark mode the default mode for our app as we all think it looks better (based on our high fidelity wireframes).
Then we split into two teams for the day. My team continued refactoring the code on our front end to add authentication with supabase. It was slow going but we made some good progress.
The second team worked on making the savings page of our app look more fun with icons and colors.
We also had the opportunity to hear from two companies that are hiring for roles that we can apply for when we finish the bootcamp. One of them is hosting a hackathon next week for potential applicants.令人興奮！
High Fidelity Wireframe dark mode
Today's Progress : Today we agreed on the name of our app: frumo (short for frugal money).
My pairing partner and I started working on the dark mode version of our app. I enjoyed learning how to use Tailwind CSS for the first time.
We also prepared and gave a presentation to the coaches and other teams in Group A summarizing what we accomplished this week.
Sprint goals week 3 and accomplishments:
Savings page with features added to make it more fun:
Today's Progress : I spent most of today with my pairing partner updating the code so that our app runs by default in dark mode and the dark mode matches our high fidelity wireframe. It was a lot of grunt work but the end result looks good. It also helped me to get more familiar with the interworking of the code on the front end, Tailwindcss, and Figma. We also tried adding a celebration animation to the app for when a goal is achieved to make the app more fun.
Another pairing group from our team worked on the landing page. The third pairing group from our team continued working on the savings page.
At the end of today, the team decided that I should be the scrum leader for the rest of our time working together. I served as the scrum leader our first week and then we started changing to a new scrum leader every two days. Even though half the team initially weren't keen on being a scrum leader, we thought everyone should have the chance to lead because it would be a good experience. It was also interesting to see people's different leadership styles.
frumo app in dark mode:
Today's Progress :
As the scrum leader today, I ran the daily stand-up and end-of-the day retrospective. That evening, one of my teammates sent me a message which boosted my confidence. They said,
“Hey Stephanie, I think you did a fantastic job leading the team today! You kept the stand-ups on point and I think we were a lot more clear and productive thanks to it!”
It was a surprise to receive their message and their encouraging words made my day.
We paired off into three teams today with tasks to complete. My partner and I worked on making the app responsive so that you can view it on mobile phones as well.
By Friday we have to prepare a short video introducing our project, create a new YouTube account for our team, and upload the video to this account. Therefore, I started preparing the PowerPoint presentation and embedding a demonstration video of our app into it.
Today's Progress :
I had a fun day today participating in my first hackathon for a potential employer. It's the first step to apply for a junior software developer role at this company. I was put in a group of four and we were given four hours to design and create a web app to promote sustainability to individuals and software development project teams. We also had to prepare and give a 5 minute presentation to a panel of interviewers from the company about our app.
Throughout the day, we were each pulled out at different times to meet one to one with someone from the company for a casual interview. I enjoyed my conversation with the person who interviewed me and learned a lot more about the company. All in all, it was a great experience. I had never worked with the three people in my group but we worked well together and the interviewers said that our presentation was really good.
Today's Progress :
Today was the last day to work on our app. It was a flurry of activity and stress but we got through it. The main things we worked on were:
Today's Progress :
Today we recorded our presentation and submitted it. You can view it here:
Frugal Fanatics presentation
If you'd like to try out our app for yourself, check it out here: https://frumo.co.uk/
Celebrating the completion of our final project!
Today's Progress :
Today I took on a 6 kyu Shopping List kata on CodeWars. First, I wrote a plan in plain English. I did something differently today though. Once I'd written the plan, I worked backwards. I looked at the best solutions and then wrote code to solve it. I did it in steps, first writing the code to solve the simplest part of the kata. For the next step, I wrote the code to include any discounts and buy one get one free deals on the products. Throughout I wrote comments explaining each line of code. I did all of it in a private repo in js files and tested them in JS Console.
Link to resource : Codewars Shopping List kata (6kyu)
Today's Progress :
Continuing on from yesterday, today I wrote code to test the solutions that I wrote yesterday. I initialised a Node.js project and installed Jest as a dependency. Then I created the test files, wrote the tests, and ran the tests ( npm test ). Loved seeing those green pass test results!
Today's Progress : Today we worked on preparing and rehearsing our presentation for the School of Code demo day.
Today's Progress : I worked with one of my Frugal Fanatics teammates this morning to write some end to end tests to test our app using Cypress. It was really fun to explore testing with Cypress. We hadn't done it since week 6 of the 16 week bootcamp.
Today's Progress :
Today we shared our frumo app to the School Of Code's partner companies who are looking to hire talented junior developers. Our team had the chance to share our frumo app with 12 people from 9 different companies. Their responses blew me away! Here are a few quotes:
"Awesome idea"
"The best presentation I've seen all day. Very professional"
"Shout out to the gamification of savings"
"Amazing app"
"Awesome presentation"
"Really useful"
"Makes dealing with money more digestible for non-financial people"
"Looks fantastic"
“精彩的”
"The dashboard is beautiful"
"Really good looking app"
"Looks really impressive. Very professional."
My personal favourite quote for the day though was:
"Anyone can learn to code with enough time. How you work with people and your communication skills are much harder to learn."
It gives me high hopes as I continue learning how to code even after my days at the wonderful School Of Code are done. I am incredibly grateful to the School Of Code for choosing me, from among the 4000 applicants, to have the opportunity to attend their fantastic bootcamp. I have been stretched beyond measure and learned more than I ever thought possible these last four months. I can't wait to keep learning and coding!
