Welcome back to another Developer Spotlight!
[BEST TALK SHOW VOICE] @katavie and I are back today with resident Repl celebrity, @Kognise. You might know @Kognise from his Repl.it mobile app... or maybe you’ve just seen him around our Twitter, Discord, or right here, on Repl Talk.
@Kognise's Game Jam submission, Dom Boom
@katyadee: Hey Kogs! It’s great to be talking to you. Would you might be starting with a short intro?
@Kognise: I'm Felix. I go by Kognise on the Internet. I live in New York. Hm, what else? I’m 13 years old. And I have a cute dog.
@katyadee: When did you start learning to code?
@Kognise: Maybe two years ago, but I only really got into more serious things about a year ago.
@katyadee: It's so funny because when I'm talking to young people it's usually that kind of timeline but they're pretty advanced. How much time you throw at it?
@Kognise: Probably too much.
@katyadee: What does that mean?
@Kognise: Recently I've started homeschooling and that gave me a lot more time to work on my own stuff and in that case that means more time to practice programming so when I'm not doing other types of schoolwork or reading books or eating, I'm coding.
@katyadee: Is it one of these things that so seamlessly fits into your schedule that it’s kind of happening all the time?
@Kognise: It’s more like that.
@katavie: What does your typical day look like?
@Kognise:Maybe I'll have a lesson or I'll travel away. I also play cello so I might go to a cello lesson. But a lot of time is spent at home or walking my dog.
@katyadee: It’s interesting because that’s how they recommend you learn a human language. It’s not necessarily setting aside time to learn it, but you should have it seamlessly throughout your day. How did you start learning? Did you have any mentor figures, or were you just interested and jumped in?
I got through the very beginning but I didn't really understand most of it. I was able to do the exercises but I felt now I feel like most of it was just copy pasting so I didn't really learn a lot from that but I that's what got me interested least in the beginning.
I moved to some Mac app that my mom found and I don't remember what it was but it was some modified version of Ruby with like a user interface library so through that I learned more logic and that kind of thing and syntax. After that I don't really know what happened. Now I'm here.
@katyadee: Was there anyone inspirational to you, or are you mostly self taught?
@katyadee: How did you end up on Repl.it?
@Kognise: I was originally trying to just find like an online HTML editor. I was using Code Sandbox but it kept like glitching out and breaking so I was searching for more things and I found Repl.it through that.
@Kognise: I think it's not as bad as I made it out to be but I do find it kind of annoying for a lot of websites to have the same fonts in the same style. It's kind of like using the default bootstrap theme for everything.
@katyadee: Oh that annoys me too! It kind of makes me miss Angelfire days. I think that might be 20 years before your time.
@katavie: That’s before my time.
@katyadee: Angelfire was like a free host for a personal webpage. Before social media was really big everyone had their own home page. You could have Angelfire or Geocities or freewebsites.com..or whatever. There were lots of options out there. It's kind of funny because some of the websites people make on Repl.it kind of remind me of those early days
Speaking of websites. I’ve been using FontKey for real, it’s pretty smart. What's your design interest, if any?
@Kognise: What's funny is I actually had the idea the night before the Space Contest was introduced and I feel like the idea of pressing the space key to choose fonts kind of like made that more of a thing and made it more useful that way I originally just had the idea of like previewing fonts on pages.
@katyadee: Where are the fonts being pulled from?
@Kognise: Google Fonts. Basically just pulling a list of all of the fonts from Google fonts and then converting it to my own format and then loading up the page.
The Mobile App
@Kognise: On my 13th birthday, I actually got my first phone like that to my own and the first thing I did was like I installed some apps and one of those was I went to the Google Play Store and I searched for Repl.it and there wasn't one, so that was my original inspiration for that.
@katavie: Why do you want to code from your phone?
@Kognise: I feel like there's always the need to tweak something while I'm away maybe I'm travelling maybe I'm just on subway and there's some typos or more to fix or even a small little bug and I feel like it's always would be it would be really useful to be able to edit that on the go.
@katavie: How does the app interact with the Repl.it website?
@katyadee: What was the process like assembling a team and collaborating with people on this project?
@Kognise: I initially wrote a post on Repl.it talk saying that I was interested in starting this project asking if anyone would be interested in providing a link to a discord server and a bunch of people joined. I've mainly been working on this myself but everybody was really helpful in helping me test it out and trying out new features I was adding and telling me if it's broken for everybody except me.
@katyadee: How long did this take? Is it still going on?
@katavie: What’s the layout, since there’s not as much space on a phone screen?
@Kognise: I loved Repl.it’s approach of like only showing things when you need them so like if you start a web server the web server little box thing opens up. I tried to keep that, except with tabs so I have like a code tab and a console tab and if you run it and there's a web server it'll pop up with like a webview tab.
@katavie: What language did you use to build the app?
@Kognise: I used React Native.
@katyadee: In an ideal world, what would the final product look like? Do you think you have the skills and time to make that happen?
@Kognise: Right now, I've just been using a material design library and been focusing on all the business logic code. In an ideal world, the end result would have its own like design similar to Repl.it and not just be run-of-the-mill material design.
I think that even if I might not have the skills -- because I only recently learned React Native for the first time to do this app -- I'll probably be able to learn them on the fly I know so far that styling in React Native is really weird.
@katyadee: What do you think is needed from Repl.it to support more people building apps like this?
@Kognise: I think I mean maybe just better documented APIs.
Node API Client
@katyadee: When I was looking through your repls, I saw your Node API Client. You’d mentioned that you’d reverse engineered Repl.it’s API? What gave you the idea to do it, how did you do it, and how long did it take?
@Kognise: This node API helps me lot speed up the process of the mobile API so I was able to even copy over some bits which was really useful and add some new things. I think my original idea was to create a load balancer that's created by automatically duplicating a repl and then creating a repl that load balances. How did I reverse engineer the APIs? basically just looking into Chrome network tab and seeing what requests are like what's requested when I click a button.
@katyadee: It seems like you get a lot of mileage out of the Chrome network tab.
@katavie: when did you first see that and how did you figure out what was going on in the network tab?
@Kognise: They made it really well laid out so it's pretty easy to figure out what's going on. like how I learned a lot of things I just kind of fooled around until I figured out how to use it.
@katyadee: Did anything surprise you about the process? did you notice any vulnerabilities with Repl.it or did anything stand out as special, or interesting?
Katya pauses. Kogs is smiling widely.
You're smiling when I say vulnerabilities, oh no…
@Kognise: Well, I'm smiling because somebody recently uncovered a few vulnerabilities. I still have all of his automatically created XSS repls in my account. But no I'm not a pen tester and I did not find any vulnerabilities...Your API is kind of weird. Like half of it is GraphQL and half of it is REST, and you split between underscores and camelcase, and it's kind of like across a bunch of endpoints.
Learning to Code
@katyadee: Do you have any advice for anyone just learning to code?
@Kognise: Don't get discouraged if you feel like you have no idea what you're doing or nothing's working because that happens all the time to everyone.
@katyadee: What's a situation where you were challenged by something and you weren't sure how to proceed? Did you get help or how did you help yourself?
@Kognise: This is kind of a Repl.it Mobile thing. One of the big bugs I was coming up against is console logging for web rebels because I had I have no clue how to like intercept console log messages and send them outside of the webview. I had no clue what to do I tried everything nothing was working and I kind of just procrastinated it and put out a message asking for help. Recently kakashi (on the mobile Discord) submitted a pull request and that apparently adds all of this.
@katyadee: It’s always nice to hear about how collaborative the community is.
@Kognise: I think that's an amazing thing about the coding and developer community in general, how like if something's open-source -- or even if it is an open source, like in the case of Repl.it -- people will write code or help other people much more than in other things