 Thank you so much for coming down today. We are really glad to have you here. The three of us, together with our coaches Jinxi, Amanda and Salomi, are here today to share with you what we've been up to for the past couple of months. But first, we'd like to introduce ourselves. My name is Sabrina. I've been self-studying, developing for a couple of months before I came across the Tech Ladies Facebook page. So thank you Facebook algorithms. I like developing because it allows me to tinker a lot. I'm that person that over-customizes their SimCity character before they start playing the Sims. And coding makes me happy because it allows me to tinker to my heart's content just on a whole new level. What drew me most to this iteration of the Tech Ladies Facebook camp is actually that this is the first time they'll be teaching a fully JavaScript stack. And of course, they'll actually be sending a live app for an NGO to production. My background is in biology, so I don't really have a lot of coding experience. So I thought it would be a really great opportunity to join this book camp to learn more about web development and coding. My name is Sabrina. I'm electrical engineering graduate. I was interested to apply to this book camp because I thought the web development skill is very useful. And I think the project is meaningful. And when I went to the book camp session, I thought the coaches are awesome. So although this was a 12-week book camp, it has actually been a little longer than that for our coaches. So back in July of last year, they first met up with our clients to better understand their needs as well as goals. So who are our clients? The Sustainable Solutions Network believed that the best way to achieve sustainability is to do it together. That means fostering collaboration between the many stakeholders in the local environmental community. They work with more than 30 environmental leaders and organizations in Singapore. They also launched their online portal back in 2016. What do SSN do? They provide online resources to create access and level the playing field across stakeholders. They facilitate topical environmental conversations from balanced perspectives. And they promote collaborative efforts among all stakeholders across the government, corporate, nonprofit and academia sectors. So how can we help? Sorry, not that one. As you can see, collaboration is a key tenet of the SSN organization. Our clients wish to have a single platform that will allow them to publish all of the environmental-related events that were being held in Singapore. Previously, when an environmental organization wished to publicize their campaign or event, they would post the details on their old website. On SSN's site, even though they had an existing online portal, they were relying on the calendar plugin on their site to inform the public of any activities that the stakeholders they worked with wanted to publicize. This resulted in a rather fractured experience for anyone interested in environmental-related events. With our app, we aim to deliver a site where all organizations will be able to publicize their campaigns and events in one place. Earlier on, I had mentioned that our coaches had met up with our clients. That makes up the first part of our timeline here. To help ourselves stay on track with our clients' goals, we create user stories on trial in the format of As a type of user, I want to do a certain task so that I may end goal. We did this to place ourselves in the shoes of a user on the app and ensure that we did not deviate from the end goals that we had identified. Moving on to the next step in the timeline, our designer currently then helped create a user interface that would best display the information that our clients deemed most important for our project. Ensuring that each user's experience on the app was as straightforward and as easy to understand as possible. Finally, with a proper design realize, we were ready to embark on the development of the SSN app. For the next step, we are using the one which comes with stands for OPP express, react and load. So react is JavaScript library which helped us build our front-end web application. Node.js is the JavaScript front-end environment which is, you can think of it as asynchronous event-based engine to run our back-end server. By asynchronous event-driven means it can handle our current request at the same time. And then express, or what is express is a web framework of Node.js that helps that handle routing to the right parts of the back-end server app. And then we also use MongoDB which is a Node SQL database to help us make our application data persistent. Other tools that we use include Tracklist CI which is continuous integration and then we also use Git as our version control system. We also use Amazon S3 to store our images and then last part of this, we deploy our application into Heroku which is a service, a platform as a service so that our apps can run in the cloud. So we have three stakeholders for our apps. The first one is project owners. It can be either organization or individuals who want to initiate sustainability events or campaign. We also have public which is anyone who wants to take part in sustainability project. And we also have admins from SSM so admins will be able to collect projects and make sure only the big ones are put up to the application. With this, I will hand over to Eunice who will ask through the demonstration. Thank you Marina. So now we look at the website as well. As mentioned by Marina, actually we have three different roles in the website. The first one is the public, the second one is the project owner and the third one is the administrator. So the first one we will show you is the home page. As we scroll down, we can see various projects on the home page. And if we click on the view on projects, we should be able to search for different projects. So now we will try to search for the month of March. And then we click the word filter, we should be able to see the projects during the month of March. And if I am really interested in the project, I will just click on the project itself. And we should be able to see more details of the project. Now back to the home page. If you are keen to register as a project owner, you can actually sign up as a project owner by clicking on the sign up link and filling in the necessary details. And then we go back to the home page again. And now we will login as a project owner. So the project owner is able to post environmental projects on the website. So as you can see here there are four different tabs. One is pending approval, active, inactive and rejected projects. And then if you click on the plus sign on the right hand side, we can post a project. For example, we just have a project on decluttering since it's the hype now. I am keen on the necessary details. And we add a picture and times before to click on the project. Then we can click on the project type which will be occurring once a week. For example, you want to take a new year's resolution to maybe decouple your room every week. And then we click on preview. So this provides us with a way to see a preview of the project before we actually submit it. So we go back to form. If we are pleased with the project, this thing will just click on the summits. And upon submission, we should be able to see it in the pending approval tab right at the bottom. So this project will be subjected to admin approval. So as a site feature, we are also able to edit the profile of the project owners. So for example, I would like to change the profile model and just change the dot on state. And then update the count. And then we go back to the dashboard and scroll to the bottom. We can see actually that our profile is updated. Then now we will move on to the admin role. The admin is to ensure that the projects are legitimate. So this endpoint here is not available to the public. Only the administrators know of this endpoint. So we will use the dummy account and log in. So similar to the project owners, we also see four different tests. But they are showing all the projects across the site. So for example, we would like to reject the project. We click on the first project as an example. We can actually click on... I mean for example, we see that this project doesn't have our address. And then we want to reject it. We just click on the reject button and provide our rejection reason. So for example, please enter your address. So when this happens, press yes. And then we will click on the rejected tab with the rejection reason. So what a project owner can do is actually edit the project. And then you will go back to pending approval more later. So now we will show you how we approve a project as well. So for example, we would like to approve the first project. And then we just click on the approve button. And then yes. And it should appear on the active tab. And as well as the home page for public viewing. So that's the general flow of our site. So if you have any other questions, feel free to approach our team members. Okay, so now we will... Before we open up the slides with questions, we would like to actually thank tech ladies for providing us with this opportunity to learn. And we would like to thank Outdoors for our coaches. And this takes as well a sense to them for the problem statement. Okay, thank you. So I'm turning to ask these amazing ladies how they journeyed by on some of the key lessons they have learned. I mean, this one of you... Before we go back onto the floor, so we can start thinking about questions now. What are your curious about learning from these ladies? So I'm very curious about something. The travel board is like amazingly scary with so many things to do at night. And then you have software and text tech with so many things to learn as well. So what do you think is the biggest challenge that you face around this bootcamp? Both as a teacher, a coach, and also a student. That's your challenge. I call it ladies because at first it's too deep up. Because at first we are only doing the tough end, but as we are moving to the back end as well, there are a lot of things. When we are even in the process of doing the tough, I'm not sure how deep up or what went wrong. Of course, time management is the issue. I need to give myself a certain time, and then it still cannot figure out. I need to ask the coaches during the lifting. So in the bootcamp, the coaches teach us several tools to debug. For example, first is the inspect. Then after that we can use the postman or we can use the debugger also in the crew. I think it's very important to know the fundamentals which I lack, and the coaches are very strong in fundamentals. So when I go to the meeting, the solution is always there. As a beginner, I would think that I need time management. After a certain time, I need to move on to another part or try other stuff. Do everyone understand your question? Yes, yes. For me personally, I use this material UI React. Just to display something, I had to look through all the types to make sure which one contains the documentation for that. It's really time consuming. Also, on that note, about time management, because we have meetings on Saturdays as well as additionally on Wednesdays as well. So we have to make sure that we have something to show or do the coaches so that we have something to discuss rather than just being stuck with something and not moving on from that. From the coaches' perspective, I think we have to balance the girls learning as well as getting this application production ready. So I think many times when you do development, you appreciate the natural evolving of your code. So you create abstract layers on top of maybe the most code in the beginning. Then you start to appreciate the beauty of your code. But sometimes it juggles with teaching the girls versus having nice code enough to get it production ready. So many times we kind of jump a few steps ahead and we extract as much as we can. We create all these abstract layers. So maybe they jump in and they need to learn how to use these classes that are already built on them. So there are these things that we kind of struggle with while teaching at the same time, making sure that it's going to be good enough for production. The challenges that we face. Yeah, it is very difficult to pinpoint exactly how much time to spend on going through the concepts versus finishing up the features that we are implementing. So we have to decide what's the cost of our work and what we should spend more time on. But overall, I think you did a great job. You did a great job. It's going to be a common challenge. And I think it's very relevant for the audience here, especially for women, trying to learn how to code. All of you have your regular days and they have jobs, right? So that's everyone else here. So I'm just curious to learn how do you eventually balance between, or do you just say that I'll be able to take 12 weeks, I'm going to start. So how do you find a balance? We can start from you. It's like a commitment. Once you set it as a commitment, you just have to keep pushing through. So that's the main motivation. When we volunteered for this thing, we did make a big commitment. So we had to set aside some fixed time just for the preparation of the lessons and the lessons itself. And I think it opened discipline with our time. It's difficult to get discipline, but we have to bear with the commitment. Now actually, at the first lesson, we took out all our phones. We deleted all our Netflix apps. For like no one could watch Netflix that high probably. I'm kidding. So we actually spent more than once a week meeting up. We actually met up on Wednesdays as well to kind of reinforce the learnings of the team and also to teach them additional concepts so that on Saturday we could spend like a full day on just development. And we struggled with that because sometimes we're kind of carrying with the nose. You kind of want to jump into the solution because you need to stop it. You don't have that much time to work through and teach for three hours before you finish a task. So we do that a lot when we jump into the solution. So that takes away a bit of that learning experience but yeah, that's what you have when you have very limited time like this. For me, I sacrifice my weekends. And I think one more thing, I think it's just like, I know we are all stressed up, right? But I feel that the atmosphere was quite nice. I mean, even though I feel I'm quite slow but nobody really, like, barely cleaned me or left at me. So that kind of atmosphere also helped in this time additional thing because somehow if you're happy that you get to work better. I think that generally sums it up. I think the six of us really enjoyed hanging out with each other. Mariana laughed a lot. That contributed to the atmosphere. You know, we weren't like so tense even though we were like stressed about sending the active production but it wasn't like a scary environment but it was also, I think we pushed each other because, like, I see, like, let's eat. But it's okay because, like, you know, others all we have put in just as much time as I had. So, like, you know, I feel really good. And your team is the first female team, by the way. So I just have a question to the microphone and also the appreciating part. So before you started and now having pretty much everything, is there anything you think you wish you knew or any material you wish you had and start to make your life a better one? I would probably consider the next time I'm going to start a short break not to the JavaScript stack. The ecosystem itself is constantly evolving. With everything that we did in this application there was a very different position made as to what packages and dependencies we were choosing. So there was a lot of work and time before this book had even started where we had to bootstrap a skeleton application for the build. So even through that, like, the live page that we were using and things like, yeah, that put a lot more additional time as opposed to using a more opinionated framework. So, yeah, that's mine. It's weird but it was really part of the development. I just sat there and I was like, if somebody can pull this off, I should be able to do it. And then because of that, I'll walk around and take another break. And then when I came back down, I was like, oh yeah, this is another way that I could solve it. So just don't pull yourself back. I think also just generally to not be afraid to ask questions because at first, I think until now I'm still quite afraid to ask questions when I'm stuck. Like, I really want to put in my honor but I think if I could just, maybe like, you know, I don't really know there for like the whole 30 minutes of one hour helping me to do that. You just like, maybe I could question and then they'll give me a hint. So I think that's quite important. Just so you know, how was the selection done? How did you select the participants and how did you plan them out? And over how many hours of the selection would be actually given an app that's built by anyone that I knew or people on the app that I knew. So I really want to let you know I've come from a few years from here and so for our project we actually built a very good question. Yeah, so a lot of the selection based on the participant's choice during the start of the bootcamp. And then from then I would kind of look at the top three choices and see whether there's a match with the team or the final three. But to choose the first three points the first place they actually had to look through the participants' profile as well as the task that they actually did for now. It was like 50% of the app and 50% of the purchase apps. How long did it take for us to come to this point? Very, very, very long. So right before the percent of the bootcamp we were actually working very hard to get and use the bot. So to see which angels are actually to serve and having us like help them. So I think our like 250 angels that we should be shot through so the work started right from then and then we chose to set it down to 30 at one call to them during our lunchtime and then kind of narrowed it down to a few where after that the purchase also took ahead in taking the angels and then from then the bot was picked as well. And then I think 10 hours I don't think it's enough to sum up whatever that the mentors and the coaches and the bot put in. It's supposed to be a 12-week bootcamp but I think they gave it a lot more I think the scope maybe could bring a lot more I think to bring a false to the coaches in there. Even though at roughly how many hours it's lost count by 114. 250? For someone who is starting out what are you sharing or being vulnerable to think that it's herself but it's actually not one and two from the rest of the panel what advice do you give to someone who is starting out and trying to let them go fuck you, join for maybe you want to let everyone experience it I said that was a system for myself where I would like really break down the tasks that I had to do in the smaller parts I would break it up because like sometimes when you sit there and then you stare at a boy and then you just get so scared with the long things that you think you have to do but when you actually break them down and then you like set checkboxes to make yourself happy you know it helps you to like get a flow of the function out properly and it makes the task a lot less daunting so definitely get your to do this out microphone text file so it was really ugly but it served this purpose so yeah I think it's really important to like I said within the belief that you can do it because I think a lot maybe you know personally I don't have a lot of belief that I can do it but sometimes I surprise myself and I do so happy after that like it's almost like during my thick school you solve the problem and you're like yes I'm the genius and then the next problem comes and you're like oh no but yeah just keep trying so like actually I think having a good foundation in programming is not just coding it's not like learning what for looks and like yeah just understanding basic programming will help you really get into the web with the development later then after that it's more about like asking questions with the coaches and like learning from them the technical aspects of work with the development if you are interested in coding you want to know what exactly it's all about and whether it's a field for you don't be afraid to learn programming science anyone can learn it that's what any available courses online have materials found everywhere just go for it look at what all of these javascript javas all about that cool course website is a really practice coding and they have like YouTube tutorials where you go to a set on how to do stuff and of course there are two camps like the one that ladies provides and many more so please do join we really need a lot of females and Shai I think at the end of the day we are like on the floor we are like only two females with like a bunch of guys so I really like love to see like females stepping forward and I feel really proud of them like it's such a short period of time they actually learn so much and they have started doing their own stories by themselves so it's really it makes me feel really happy that like they are held down to reach this far so yeah don't be afraid go for it also shout out the thought once they have a jump stack program which is a how long did it? it's a three month program three months full time just Google it jump stack that's another in-compatry programming so Google can teach full stack so that's also another way you can get into programming and understand stuff follow us I think it's important for us to be on the stage alright with that thank you so much give us a sense we have another round of applause