Here is the Prep-Work Facebook Project
The instructions for this can be found: Viking Code School.
This was a good project to increase the understanding of CSS, it really Markup your code Muscles.
you can find the pages created at: shell-facebook.mycode.website.
And here are the Images:
On this Viking Code School Prep-Work assignment we have to create a simple statick website, the instructions are to create it to look like the image below:
It might look easy, but I’m still learning, later I will come back and recreated the code, because this time around I basically: <Div> & Id=” ” the heck out of this website, when you see the code, you will find out what I mean for that, in few words this is a static website created only with: HTML & CSS.
For more details on the instructions go to the Viking Code School.
The following is an image/link to the website created, you can find it: vikingstore.mycode.website
he GitHub repository: Viking Store.
Today Exercise was to create a Clone Shell of Google.
I did some websites before, but as simple as this site might see, it require some CSS that I did not know, so I had to go back and review the materials provide for the Viking Code Prep-Work, and in an ironically turn of fate, I use Google (a lot) to find information in how to accomplish some of the desired outlook, and after few hours we accomplish something presentable.
For more details on the instructions check the Viking Code School website.
Below is a print screen from today Veterans Day 2016 Google front page.
And here is the Google Clone Shell, I hosted the files on a server so you can see it in real life.
The GitHub repository: Viking Google.
This is the final project for the 3rd section “Engineering” and one more to go before apply to the immersive program.
The precise instructions for this project are in the Viking Code School.
Basically, we will create a Menu Navigation Bar, to do that there are two main steps.
- Create some stories on Pivotal-Tracker.
- Pseudo-Code the Menu.
Here is my work on Pivotal-Tracker.
Here is the Pseudo-Code:
This is another assignment for the Viking Code School
You live in a 25 story building with one elevator. The central microcontroller got eaten by rats and the building manager has asked you to code up the elevator’s operating procedure until he can get a new one. You figure you’ll have to learn to actually code soon but you first want to think things through and pseudocode your design.
Your job is to design a properly working elevator. It should stop on each floor it is physically able to during a given trip to pick up whoever is going the same direction. Additionally, make sure that no one is:
- smashed into the ground
- pushed through the roof
- squished by the doors
- let off in between floors
- stuck going the wrong direction (unless they choose not to exit)
This will be good practice thinking about all the edge cases and scenarios that a user can do.
The point isn’t to follow any strict guidelines of syntax but rather to focus on getting the logic of the problem figured out and then organizing it into modules that accomplish the sub-tasks that are required.
- Using a loop around everything to keep your pseudocode (and elevator) running.
- Writing everything in one giant mess to start with and then refactoring it to break apart the modules so it feels less cluttered and messy.
This is Pseudo-Code.
10 friends are sitting in a circle around a table and decide to play a new game. In it, they count up through the numbers from 1 to 100. The first person says “1”, the second says “2” and so on… but with a few catches:
- Whenever the number is divisible by 7, they switch directions. So person 6 will say “6”, person 7 will say “7”, then person 6 again will say “8”.
- Whenever the number is divisible by 11, they skip the next person.
Your job is to pseudocode a program which will determine which player says the number 100. For this one, be as specific as possible to actually write out the logic of the procedure.
Another Pseudo-Code practice for the Prep-Work.
Let’s go shopping! You’ve got a list in hand with a variable number of things that need to be procured from the grocery store. The store is laid out into 10 aisles but their signs have all been taken down for repairs so you’re not sure which aisles contain which foods.
Write a program which will acquire and then check out with all your items. Start with very broad strokes and then get more specific until you’re comfortable with the level of detail. This will probably require more than 50 steps.
On this part of the Prep-Work we are woking with practicing Pseudo-Coding and here is my answer for the Grilled Cheese:
instructions: Just to get in the right frame of mind, we’ll start with a classic pseudocoding exercise — writing a recipe. In this case, break out the recipe for making grilled cheese into discrete steps.
Viking Code School: Engineering 1 – 16.
I did not post for few days but I just need to post the progress on the Prep-Work.
this is a good preparation and I’m learning from this content, the member of this school do answer the emails that I send and in general things are great.
Here we use a service call Pivotal Tracker to create the stories for the Viking E-Comerce App.
Your assignment is to break down those high level goals into user stories and add them to a Pivotal Tracker project. You will need to create a Pivotal Tracker account and a new (public) project, which is free. Follow the overall approach we talked about with agile stories:
01 –Gather requirements
02 – Break down the project into stories
03 – Determine the points values for the stories
04 – Prioritize the stories
here is a quick picture of my work on this assignment.
On the Prep-Work there is project to do a Mock Up of Facebook.
for more details on the instructions click: “INSTRUCTIONS”
I need to go back and get more familiar with Balsamic, for one reason I don’t know I was not able to print my work the way I want it but here is for you.
This section was a little hard at the begging, before I always use powerpoint to do my Mock-Ups but I follow the instruction of using Balsamiq, and I start with the online test, I did not know that I had just one hour before the software would destroy my work, and after a full hour of productive work the page blink and automatically delete all the work I had done, immediately after realizing what just happen, the reasons and implications of the event, I immediately sing up for a trial version and begin from square one.
after a little time with the learning curve, I found the balsamic tool really good, for instance when I do mockups on PowerPoint I take a long time to come up with the images and icons that will be used, but Balsamiq has them right there.
after that, I finish the final project and deliver it via Git. (what a great tool.)
today was learning day on Balsamic, this is an amazing tool in the designing of a blueprint to follow when is time to create a website.
this tool is good because it makes the process of Mocking Up a new project, it allows the addition of your own text and you can change the dimensions of anything that you put there before I alway use powerpoint and sometimes I use Excel. but this balsamic tool is really more simplistic, the downside is the monthly fee, and the instructions in the Prep work are that we will not use it that much in the course, so I will not purchase for now.
In this sections we got to learn more about the UX and design of the products that we are learning to build, as we mention before the creation of a website is not jus code and code, that would be the equivalent of you wanting a home and asking some construction workers to build one for you, sure they have experience at building, but if there is not a blueprints to follow, well, the final product might not be good.
same with a website, as mentioned before one of the first things to know before the creation of the website is to know who would be the audience, and propose of the website, and using that information as a base build the blueprints that will provide the good programmers the path to follow in the process of coding.
to this, we will add the composition of the layout and the creation of the visual hierarchy, then the selection of fonts and colors while keeping good rations using a grid system will help not just to the esthetics but also to the effectiveness of the site to reach the users and be useful.