Memo Writing Practice

For my last assignment of this quarter, I was “hired” as a lead mobile developer and had to provide recommendations on BuySell Inc’s buying and selling application, research market competitors (LetGo, Mercari, and OfferUp) and choose a Cloud Service Provider and recommend at least three MBaaS services for the new application. I had to also list the requirements and scope of the work. It seems persuasive, yet professional.

BuySell, Inc.

To:      Chief Technology Officer

From:  Elyse Segebart

Date:   December 13, 2019

Re: MBaaS Services for BuySell Application

Chief Technology Officer,

After careful research and consideration, I have determined BuySell, Inc.’s BuySell application will benefit from using a Cloud Service Provider (CSP) and Mobile Backend as a Service (MBaaS) services to compete with other applications in the market. This will allow BuySell Inc. to get the application running quickly while reducing cost of implementing a mobile backend infrastructure. The business problem lies in which CSP to choose and what MBaaS services will be necessary for the application. After outlining the scope and requirements of the application, I will provide the MBaaS services I recommend and their necessity.

BuySell requirements scope includes:

  1. Advertise and browse products and services
    • a. Sellers advertise products and services using a variety of media
    • b. Buyers browse a catalog of advertised products and services grouped into common categories and subcategories such as clothing, electronics, household, handmade, etc.
  2. Connect buyers and sellers
    • 2.a.Buyers interested in purchasing an item from a seller will be able to communicate with each other about said item
  3. Transactions to buy an item will be completed in an easy and secure environment
  4. Shipping options provided for buyer to include shipping or offer Free shipping by paying the shipping out of purchase amount
    • 4.a. Prepaid label will be provided for all shipped transactions
  5. Users will be able to provide feedback on the buying and selling experience

Scope does not include:

  1. Methods to verify sellers (such as ID check, phone number, or badges indicating factors such as fast shipper, member since, or quick responder)
  2. Other payment methods such as PayPal or Stripe integration
  3. Moneyback guarantee or Purchase Protection on items bought and sold within the application
  4. Targeted ads within application

In reviewing different CSPs such as Amazon AWS, Google Firebase, and Microsoft Azure App Service, I have determined Google Firebase will be the best option since it is designed to be scalable and user-centric while aiding in creating the best user experience. Firebase provides a real-time database platform and a real-time database management API so there is no need for a backend server, the ability to sync real time data in the application, authentication, cloud storage, analytics, and crash reports.

The MBaaS services I would recommend for this application are:

  1. Firebase Authentication. Signing up and signing in are an integral part of the user experience and should be made as simple as possible with security being a forefront consideration. Firebase makes this easy to integrate different methods of signing up and signing in using phone authentication, email and password, or social media authentications in 10 lines of code or less.
  2. Firebase Real-Time Database. The application will include messaging between users and listings that include a variety of media that will need to be stored. The Real-Time Database is a good choice since it stored in a NoSQL database using JSON and is hosted on the cloud. It integrates with Firebase Authentication making the security model very intuitive.
  3. Firebase Cloud Storage. Photos and messaging will be hosted on the cloud and storing it in the cloud would be a logical option. Using cloud storage will improve the user experience by making data efficient and accurate while improving bandwidth.
  4. Google Analytics for Firebase SDK. Metrics are a very useful and integral part of improving business and optimizing applications. Metrics may include user demographics, app engagement, or user retention. There is unlimited reporting for up to 500 unique events for free and across all devices for web, iOS, and Android.
  5. Firebase Crashlytics. Making a quality application will enhance user experience. This service will help identify and categorize errors at runtime and determine which bugs require immediate attention. This will also enhance productivity by using resources efficiently.

If you have any questions or concerns regarding my recommendations, I encourage you to contact me and we can review them together.

Sincerely,

Elyse Segebart

Lead Mobile Application Engineer

Cell: (555) 222-3333

PhoneGap Tips: Beginner Guide to Creating and Testing Your First App

Recently, I took a Cross-Platform Mobile Application Development class and worked with PhoneGap for the past five weeks. PhoneGap was developed by Nitobi Systems, but was acquired by Apache so it’s actually Apache Cordova now, but you can still download it as PhoneGap and use the PhoneGap commands in your terminal. I will refer to it as PhoneGap throughout the rest of this article.

So PhoneGap allows developers to create mobile applications without having to write the mobile application in its native language. Cool, right? The application can be developed in HTML5, CSS3, and JavaScript and PhoneGap does all the under the hood stuff to make your application run on the platform you desire. I used PhoneGap to create Android applications and used the PhoneGap application on Play Store to run my PhoneGap application on my physical device.

Before you get started, you will need to install the PhoneGap CLI and node.js for your JavaScript to run in your application. The documentation is very easy to follow and you can find it here:

Documentation for PhoneGap CLI is located here -> http://docs.phonegap.com/getting-started/1-install-phonegap/cli/ (*make sure you click the CLI tab and not the Desktop App tab above the documentation)

Once you have done that, we are ready to get started! Woo!

To create your PhoneGap application, navigate to the directory you want to save your application. For me, I am navigating to my phoneGapApps folder I created to store my projects.

Navigating to the folder to save my application.

We are now ready to create our first application! The photo below shows the command to create an new PhoneGap project.

Creating your first application from command line.

To use the phonegap commands, you want to change directory to the www folder in your application. Of course, your file directory may be different than mine. SO, if you go into File Explorer, click on your project (I am using my airport info project, use your myFirstApp project), and click into the “www” folder, right click the text box that says what folder you are in, and copy address as text:

Copy address as text from file explorer.

Now we can go into our terminal and cd (change directory) to this directory. Don’t forget to add quotation marks around your file location.

I used the Brackets.io editor because it has live preview for Chrome. If you are in Chrome browser, press CTRL + SHIFT + I and it will open the Chrome Developer Tools. There is a little symbol at the top of the developer tools that looks like a little phone and tablet, click that and BOOM you have Device Mode. Okay? Okay. Now above your device in your browser, you can see you can select different devices with different screen resolutions and add/edit the screens you want to test on. To the right of the tool bar, you will see a little rotation button so you can change the view of the screen to test on that as well. WOW. Pretty cool, right?

Okay, but I want to know how to test from terminal. Yes, testing from the terminal is pretty sweet. So, in order to do this without getting an error, we need to remove the browser platform installed and update it with the new browser. You have to do this on EVERY project. While we can combine these commands together using &&, it has failed me before, so I prefer to do them one at a time. In your terminal, while in the “www” folder of your app in command line (which you still should be) type this:

Removing current browser platform.
Response to removing browser platform.

[PRO TIP: Whenever you see a $ sign in examples on stackoverflow or other sites, it just means you are typing a command like it shows on MacOS when you are in the terminal. I use Windows and this would have been a GREAT thing to have learned about a year into coding. I probably typed so many commands that would’ve worked, had I known that I didn’t need to type the $ sign! BAM, saved you a ton of time and tears.]

Now, we add in the most current browser platform.

Adding the current browser platform.

Now we are all set to run our application from our terminal. The command to run the PhoneGap application is:

Executing PhoneGap application in browser from CLI.
PhoneGap application result from using run command.

This is one way to get it to run in the browser. You can also use the Live Preview mode in Brackets.io. The third way to try it is to type:

phonegap serve –browser

Using server to serve application to browser.

Then switch to your browser window and type localhost:3000 in the URL box. Your application should open and you can CTRL + SHIFT + I to get it to device mode.

Opening application after serve command using localhost:3000.

When you want to get out the application running in command line, just hit CTRL+C a couple of times and it will ask you if you want to end it. Type Y. Boom, you’re out.

So there you have it! You can now create a PhoneGap application from command line, add and remove the browser platform, use Chrome Device Mode in your browser, and test your app in your browser three different ways.

In future posts, I will show you what to remove from your project, how to edit your project using Brackets.io, how to create a barebones template, and how to test on a physical device.

You can download the Brackets editor here -> http://brackets.io/

I hope you enjoyed this post, let me know your thoughts or if this helped you in any way. I love feedback!

Gradle Build Process and Deploying Your App

So far, here’s what I have learned about how the Gradle build process works when you are ready to sign and deploy your Android application:

  1. The application source code needs to be in DEX (Dalvik Executable) files. The compiler converts all source code into compiled resources that include the bytecode that runs on Android Devices.
  2. DEX files and compiled resources are organized in one package by the APK Packager. The final product is an unsigned APK and needs to have a signature in order to be installed or deployed.
  3. There are two ways the APK Packager signs your app:

a. The debug version of your app is for testing and profiling only and will receive a debug keystore which is also the default keystore for new projects in Android Studio.

b. The release version (the one you will release externally) will receive a release keystore.

4. The packager will use zipalign tool before generating your final APK. This ensures it is optimized to use less memory when running on a physical device.

A signed APK file will include a “META-INF” folder containing three files: manifest.mf, cert.sf, and cert.rsa. Unsigned APKs will require a user to enable Unknown Sources to be able to install it. Amazon accepts unsigned apps for their store and Google Play Console does not. When you want to market your application, many users prefer signed ones over unsigned ones because downloading from unknown sources could be dangerous as it might include viruses, malware, or spyware.

References

Google Developers. (2019, January 23). Configure Your Build. Retrieved from Android Developers: https://developer.android.com/studio/build/#build-process

Mangroliya, S. (2012, April 23). Android differences between signed and unsigned .apk files? Retrieved from StackOverflow: https://stackoverflow.com/questions/10280278/android-differences-between-signed-and-unsigned-apk-files/10280362

Why Should I use Material Design in Android?

Material design is very important for visual aesthetics of an application. It allows Android developers customization with stylized UI widgets, layouts and colors, and applicable themes or APIs for custom shadows and animations. The foundation categories are environment, layout, navigation, color, typography, iconography, shape, motion, interaction, and communication.

Photo by Stephen Frank on Unsplash

Looking at an Android application, you can spot common features between several apps, but there lots of things you may notice that are different as well. After all, those differences are what sets one app apart from the other. We are all familiar with App Bars and Navigation Drawers, which afford a neatly organized, compact feel and saves space for your most important information to be displayed. These are two components among many options in material design.

App Bars are at the top of the screen providing icons for quick reference like Search and Files. The three dots in the top right corner are called an Ellipsis. When used in writing, they are placed horizontally “…” and provides an intentional omission of a word. The three dots are also called an Asterism (***, ⁂, or three dots) and it represents a section break in a document. This “omission” of controls is opened by pressing the three dots and aids in keeping the design of the app compact, but separate from the menu items. It is commonly known as the “More Options” icon.

App Bar with hamburger icon Menu button in top left corner and three-dot More Options icon in top right corner.

The Navigation Drawer holds your Menu functions for the application and is opened by pressing the three-lined horizontal button in the top left corner more commonly referred to as the Hamburger Menu icon (because the three lines looks like a hamburger… you have to use your imagination a bit!).

Material design also streamlines the familiarity that users love but has a plethora of options for customization with different views, like lists and cards, or custom typography. These options allow designers the freedom to create custom animations for touch feedback in UI controls, changes in view state, and activity transitions (Google Developers, 2018). Since space is limited on our digital screens, material design also provides system icons that are used in place of text to symbolize common actions reduced to its simplest form to express specific characteristics.

When you need to change the look and feel of your application, Android Developers (http://developer.android.com) provides Material Design guidelines and resources to help guide the design process and also provides tutorials for the radically ambitious to create their own material design!

References:

Defining Custom Animations. (n.d.). Retrieved from http://www.androiddocs.com/training/material/animations.html

Android N Developer Course: D5

Today I created a higher or lower game in Android Studio. Used Random class to generate a random number when the app launches.

Created a method that takes the user input when a button is clicked and converts the String to an int. Then I used If statement to take the int object and compare it to the random number that is generated. The app will tell the user higher or lower based on which statement is true. If the number is correct, it tells the user “That’s right! Try again!” and added the Random number code to generate a new number so the user can play again.

Went one step further and created a method called makeToast that takes a String object as its parameters and will display a message to the screen. So when the makeToast function is called, it will display the appropriate message.

This was super fun and it was great to see how to further simplify code by creating the makeToast function. I didn’t see it right away that it was possible, but with time I think I will get better at simplifying my code. And a photo of the app!

Android N Developer Course: D4

100 days of code: D8&9

Today I built currency converter application to take in Dollars and use toast to pop up the message in pounds. Even added the little squiggly pound sign to make it look more official. This was the end of the Android course section two. Next is the Java deep dive which I am really excited about. Some of the takeaways from the currency converter are using

String.format(“%.2f”, poundAmount)

In this example, the String.format sets the decimal point to two places and accepts the variable it will be formatting as the second parameter. If you are wondering what the “%.2f” means, like I did, %f is the format specifier for float data type in the functions printf and scanf. This format specifier will display up to six digits after the decimal point, but using %.1f or %.2f will make the precision to the first or second digit.

I added in the currency photo from Google and matched parent width.

I had to take the EditText (which is a String) and create a new variable and parse it to a Double. I added the conversion and assigned it to the variable poundAmount.

Then I used toast to display the conversion to pounds at the bottom of the screen.

Here is the code snippet:

And the application output!

Android N Developer Course: D3

100 days of code D6 & 7.

Created an application that takes two photos uploaded to the drawable folder. Added a button called New Cat and when clicked, will display a photo of a different cat. First tested that my button worked by using the Log.i to display a message to the log to ensure that my button was clicked. Created the onClick function called “clickCat”. Worked very similar to the EditText, only used ImageView and typecasted the findView to ImageView. The second part was to use

image.setImageResource(R.drawable.cat2);

to set the image to the second photo upon being clicked.

You can use Properties > Scale Type to change how the photo is displayed in the screen. FitXY stretches it to the edge of the container, fitStart keeps it in proportion and aligns to top of container, Center keeps it in proportion and centers the image. Center is probably one I will use the most.

And here are my results!

Beautiful cats aren’t they?

Android N Developer Course: D2

Day 5 of 100 days of code.

Learned about Toast today. I think its cute they call it toast because it pops up at the bottom of the screen like toast does out of the toaster.

Toast can only be Long or Short: meaning it will show up at the bottom of the screen for a short or long time. You can also use the variableName.getText().toString() to retrieve what the user entered and display it to the bottom of the screen as well as concatenate any message you want to go along with it. In this case, I added “Hi there, ” so it would display before the name retrieved.

I made a small toast program that has a TextView, a PlainText spot to enter your name, and a button that says “Click me!”.

In the MainActivity, I created an EditText variable and typecasted so the program can find it in the Resources. Here is the code to create this program and the result below!

Overall, I thought this was a neat little bit. I remember watching this video like a year ago and I didn’t think I was ever going to understand it. Well, LOOK AT ME NOW! 🙂

Android N Developer Course: D1

Days 3 and 4 of 100 days of code.

What I’ve Learned:

I had a problem getting my project set up and kept getting the error “Add Google Maven Repository and Sync Project”. The solution to this was to go into the Gradle Project: Build files, find “allprojects” and inside of “repositories” add google() and sync. This error was realized in the MainActivity, my class file for the “import android.support.v7.app.AppCompatActivity;” was read and the AppCompatActivity was red. So, if you ever have this problem.. this solves it. I was trying to run a version of Android that was too old since I am working on the Android N Developer course and had to update it to SDK version 28 and it required the Maven repository.

If you are struggling with getting layout to work in the activitymain.xml, check one of two things. First, go into your component tree and see if you have ConstraintLayout or RelativeLayout. RelativeLayout is a lot easier to work with since you can drag and drop the components onto the screen. Right click ConstraintLayout and “convert view”.

Second, if you ARE using RelativeLayout and they keep popping to the top left corner, go to the top left of your design screen and you will see a tiny little magnet. Click this to turn autoconnect on/off.

Something interesting I found out is 1 dp is roughly 1/60th of an inch. So 160dp is about 1″ on any Android Screen. Good to know for design!

If you are working with TextView and trying to retrieve the text from it by clicking a button, you will create a function that is called when you click the button. You will declare a variable of EditText and typecast EditText to the findViewById (since find VIEW is obviously looking for a view). “R” is for resources and then you will find the ID you entered for the component in the xml file. The button you created on the screen will also need an onClick function saved to it in the XML. You can use Log.i which takes a String tag and String msg parameter. I used the tag as “Info” and used the ID and getText().toString() function to return what it retrieved and convert it to string to display to the log. Code below to explain!

Find this helpful? Connect with me to get these kind of tips everyday!

Thank you for checking my post out.

Why Read My Blog?

If you’re reading this, chances are you are in the same boat as I am: learning to code and finding your way. Most likely, you’re interested in other things and maybe you share some of the same passions as me.

I am in my last year of my BS in Information Technology with a specialization in Software Development. I have worked with HTML, CSS, JavaScript, Java, JavaFX, FXML, XML, Kotlin, and have a passion for mobile applications.

I am also interested in health and fitness, meal prepping, nutrition, helping women in technology, sharing knowledge, reading self-help books, self-care, playing piano, and advocating for others struggling with addictions and helping them overcome it.

The main focus of this blog is just to jot down all the little tips and tricks I learn along the way while coding and also post what I am working on to Twitter. I think that those things need to be shared with others (and having a log of those things will also help me remember how I did something!). How many times have you encountered an error or worked through a problem only to encounter it again and say, “I did this before and I don’t remember how to do it now! ARGH!”. Well, I have done that more times than I want to admit so this will be a collective journal that hopefully someone other than just myself will get use out of!

I would love to connect with other tech women and share experiences and learn from each other. I think that education is a social endeavor and the more we can communicate and learn from each other, the faster it will help all of us advance.

I am starting with the 100daysofcode challenge and will be updating this regularly with my progress. If you are doing the same challenge or want to learn more about it, connect with me and we can work through it together! I love accountability partners.