Summer Internship at REFLEKT: Week 9

Things started off a little slow at the beginning of the week due to my time away last week. As always, after a break from working on something, there’s sort of a re-calibration period that you need to get back in gear. Fortunately enough, that period didn’t last too long and I was able to focus on my next project: the tenant creation page for the admin portal. The purpose of this page is to create a tenant, or group of users, that can be added to or edited later.

One quick note about the term “tenant;” I hadn’t really heard it used in a context like this before working on the admin portal. I’m well acquainted with it now, but I’ve spoken to the team about this term possibly being confusing for new users. After consulting with the marketing department about this issue, they think the best way to go about deciding the term for this would be to do some benchmarking research pertaining to what other similar companies and apps are using. It’s worth knowing what users in our target demographic are already used to so that they don’t have to adjust to a new set of terms, if possible. Hopefully this research becomes part of my coming goals in the next few weeks.

Currently the tenant creation page exists in my designs and has been a planned functionality of the AP for about a year or so, but it has yet to be added to the live site. This was exciting for me because I actually got to use some of the Angular skills I’ve learned so far to make that actual addition. New pages in Angular can either be added through the command line or manually. In either case, a new folder is generated in the “views” folder of the project with the name of the page. Within this folder is an HTML file, an SCSS file, a component TS file, and a routing TS file. HTML is old hat at this point, but before my internship, SCSS and TS were new to me. For SCSS, it turns out it’s pretty much just CSS with variables – thus the name Sassy Cascading Style Sheets. I still don’t know much about TypeScript, but I do know that the component file determines what libraries and other files are used on a certain page and the routing file determines how it is linked to other pages.

Video of  fully functional Roles page!

I can’t explain much more about tenant creation (at least the features that are to come) without giving away some Reflekt secrets, but I will say that at this point it’s pretty much a few input fields with a drop down. You’ll notice that for the input fields, I took some inspiration from Google’s Material Design inputs. I think the interactivity here is subtle and kind of fun, and I used components of it to make the forms of the AP a little less static.