1. Provide a brief introduction to the assignment along with a link to this page for further details
In Assignment 2, we had the option to have a partner for this assignment in which I did. In this scenario, we were asked to create a new website that allows users to register on the website and also login after registering. The invoice page also shows the user’s username, name, and email after they purchase products from the website. User’s also had to register/login before completing the purchase and viewing the invoice page. The main requirements for this assignment was implementing a login, registration, personalization, persistent data, and security. We also had to make improvements to our code such as having a more elegant interface while displaying errors and making the forms sticky, write easier to read with commented code, write more effective/general code, and know how to debug our application properly to ensure user’s do not run into any errors. We also had to implement validation for the login and registration page such as having a specific length for the user’s username and password and prevent illegal characters in any of the form fields. A link for more information about Assignment 2 can be found here.
2. What did you learn from this assignment?
The lessons that I learned from this assignment was learning how to create a login and registration form for users, validating/processing form data, how to use file I/O for storing users, redirecting to different pages after logging/registering, creating personal modular functions, implement security functions, and how to debug our application appropriately. The biggest lessons I learned from this assignment was time-management, persistence, the importance of algorithmic thinking, knowing exactly what is required of us in this assignment, and that there is more than one way to solve/approach a task. Aside from knowing enough information to implement the requirements for this assignment, these four things intertwine with each other and allowed our group to finish the assignment on time with accuracy and not need the extension that Professor Port gave us. Time-management was crucial because we had only one week to complete this project, in which our group did. We worked hard on this and put in around 50 working hours into this assignment. Within this time, we carefully implemented, tested, and debugged countless times all of the requirements. If we had not planned our hours for this assignment, we probably would not have finished this assignment on time with accuracy. Persistence was important from me because a huge part of coding is spending a significant amount of time not knowing why your code is not working or how to go about satisfying a requirement of the assignment. This is where algorithmic thinking comes in. After this assignment, I realized the importance of having this skill as a programmer because it is necessary to help you write effective code and solve problems. Whenever we were stuck on how to implement a certain function or to figure out why we got certain errors, algorithmic thinking forces you to break things down step-by-step so that you do not feel overwhelmed by all the lines of code that you are reading. This way of thinking saved us a lot of headaches by allowing us to implement more effective code and debug code in less time. Knowing exactly what was required of us in the project was very crucial to not only ensure every requirement was satisfied, but also help with programming our application. Me and partner spent almost 30 minutes just reading the assignment 2 requirements page on the website to plan out how we were going to tackle each task. We also translated the requirements into pseudo-code in a way that helped us write the correct statements, functions, and etc. Lastly, I also learned that there are multiple ways to approach a problem or implement code. For example, conditional statements can be written in different ways to validate a form and functions can be written in different ways to accomplish one task.
3. Did you work with a partner? Assign an estimated percentage on the amount each team member contributed to the assignment (including yourself).
I did work on this assignment with a partner. An estimated percentage of the amount each team member contributed to the assignment is 50%/50% because we worked on each file at once. Me and Daniel worked on every file in the project together in person and over Skype. We meet in the library for a minimum of 3 hours per session and also met outside of school with a minimum of 5 hours per session and two 12 hour sessions on the weekend. So instead of working on each file of the assignment separately, we worked on each file together. As a result, we were able to finish the assignment on time with a lot of time to spare and both of us knew each and every detail of every file we wrote. Every function, every statement, and every line was followed by the other partner for better accuracy and problem-solving. If we were to work on it each file separately, then I think we would have taken longer to finish because if one of us encounters a problem, the other would not have an easy time knowing what is causing it due to the other person not working on the same time as them. Working on each thing together made sure we were both on the same page, both partners can spot errors much quicker, questions by one partner can be answered/confirmed by the other partner much quicker, reduced chance of errors, thus finish the assignment more efficiently. It also made algorithmic thinking much more easy and effective because of working on each task together. When figuring out how to go about executing and satisfying the requirements of the assignments, we would both talk about it out loud and share our thoughts on how to approach each task. This was very effective for this assignment. You would think that you could get more done by each person working on different things separately, but we are not experienced programmers and this could have caused linking problems between files or made it tougher to have the right variable names and understand what the other person wrote. Overall, Me and my partner both deserve the 50%/50% even split because we truly did everything together each step of the way and I have no complaints whatsoever.
4. How did you get help when you needed it? What did you need help with?
I am proud to say that me and my partner did not get much help at all for this assignment except for 2 lines of code from Professor Port on how to turn queries into a string and pass them to another function and I received help for this by visiting his office hours. By asking for help and confirmation from Professor Port, some tasks made more sense and it made it much easier to complete the assignment because this was also used in both the login and registration functions on the server. The lines of code were request.query.variablename and querystring.stringify(request.query). These lines of code are what allow the server to pass certain error messages along with user information to other functions to display on the webpage. Other than that, I was proud of group to develop almost all of this assignment by ourselves. Nearly all functions and statements were implemented by our own algorithmic thinking! Although we faced many challenges during those long hours, we got everything to work properly and met all of the requirements for this assignment without much help. Another small portion of “help” that I must mention is online sources. By me and my partner knowing what we are looking for or what the specific problem we need help on for our code, it became much easier to search for examples/solutions on the internet because we were more specific on what code we needed to research more of.
5. How was developing this assignment different than assignment #1?
Developing this assignment was different than Assignment 1 because not only were there more requirements, but it also required more algorithmic coding and thinking to complete the requirements. Assignment 1 may have been tough because that was our first assignment to get things started, but this assignment was much harder because of the amount of functions, conditional statements, validations, and javascript coding in general. We needed more algorithmic thinking to implement statements for validation on the login and registration. For example, we had to make the page stick only certain form fields and display more than one error on the page while showing where the error was located. We also had to figure out how to pass queries to certain functions based on the input and actions of the user so that the correct and more than one error is shown if need be. Not only did we have to implement requirements for login and registration to show errors, we also had to implement functions to allow the user to be redirected to the invoice page if everything is entered correctly. Overall, writing the functions while aiming to meet each requirement of the assignment definitely tested our algorithmic thinking skills by requiring us to make use of many JavaScript functions, conditional statements, algorithms, form processing, and file I/O. After completely finishing the assignment, my thought process and methods of handling problems or completing tasks greatly improved.
6. Estimate the % of time you spent (a) thinking about how to do something, (b) writing code (but do not include testing, (c) testing and debugging
We spent 40% of the time thinking about how to do something, 30% of the time writing the code, and 30% of the remaining time testing and debugging. We spent more time on thinking about how to do something because we had to plan out what type of statements we needed to use to get certain things to display on the webpage or what needs to be included in certain functions to make the page react properly based on the user input. Writing the code took quite a while too because although we may have figured out how to do something, we did not specifically know how to write out everything without encountering syntax errors and this where we resorted to online resources. Searching for correct information for our code also contributed to the time of writing code. For example, we had to use a regular expression for the email input. A regular expression are character combinations in the form of string we specifically used !(/^[a-zA-Z0-9._]+@[a-zA-Z.]+\.[a-zA-Z]{2,3}$/.test(regInputEmail)) which makes sure the user does not input illegal characters in certain areas of the email address. Testing and debugging took just as long as writing code because we encountered many errors while testing our application. To debug, we constantly had to inspect the webpage to test if certain variables were defined and if they were getting passed to correct functions using the console. We then had to go back to our code to see where we went wrong and this took a long time as well. To make things easier for us, one partner reads the code out loud as this makes it easier for both partners to spot any logic or algorithmic errors within our code. We constantly had to test our code over and over to make sure we got no errors from trying every possible outcome the user may encounter while using the website. Testing also helped us spot any requirements we may have missed because if we missed a requirement, the page will give us errors or not react to user input.
7. Describe what worked well with this project? What did not work well?
What worked well for this assignment was both partners working on the same file and following along the entire way. What did not work well was during the very beginning part of this, we tried having one partner work on one file and the other partner work on another file. However, this caused linking problems between files and functions due to having different variable names. We also kept asking each other how to do certain things or if we are doing certain things correctly, which constantly distracted us from the file we were working on. Things became too complicated so we decided to work on one file at a time together and never looked back. Similar to what I have stated above in number 3, working on the same file allowed both of us to stay on track, know each and every detail of the assignment, discuss ideas/problems we encounter, and finish writing code much quicker. We are both beginners when it comes to programming, so having someone to talk to while coding made things much easier and it also allowed for us to share ideas on how to tackle certain requirements and problems. We also inspired each other with new ideas for our website, which is an added bonus. Ultimately, having two people work on the same file improved our efficiency, accuracy, and creativity for this assignment.
8. If you could go back in time and do things differently, what would you do differently?
If I could go back in time and do things differently, was maybe ask for help from Professor Port instead of spending long hours figuring out how to do certain things ourselves. Although we completed the majority of the assignment ourselves without any help except for a couple lines of code, going in for help would have saved us time on certain parts of the assignment. For example, we spent a long time on login and registration validation, so we could have gone in for help to get some ideas on how to complete this requirement. Another thing we could have done differently is finding ways to write more “general” or concise code because it makes it easier for others to read your code will save time on actually writing the code. We could have spent more time thinking of ways to shorten our functions. There could have been statemented we might not of needed for certain functions. However, I believe that this skill and knowledge will come in time as I get more practice with programming applications.