# Zenpal --- <!--Terry--> Our project this week was to create a backend for our Zenpal app. This weeks focus was on databases and routes. We alsp wanted to gain experience rendering the info coming back from DBs into React props. --- ## Our Problem <!--Terry--> To rectifity remote working health issues. From user testing we discovered users wanted a way to track their working times.  --- <!--Terry--> ## Team Aishah- UX/UI Terry- DevOps Ephie- Quality Jennifer- Facilitator --- <!--Jennifer--> ## Build Plan  --- ## Velocity! - Compared to last week: we were faster! - What took longer than estimated time: Routes, React components! - What took less time: Implementing unique usernames, debugging Heroku deployment  --- <!--Ephie--> ## Demo --- <!--Aishah--> ## Interesting bits of code  ---- ### SQL Experimentation ```javascript= function displayAllData() { return db .query('SELECT * FROM work where user_id = 3 UNION SELECT * FROM play where user_id = 3') } ``` ---- ### Unique Usernames ```javascript= sendSignup(usernameValue, passwordValue) .then((response) => { if (response === 409){ //TO-DO: render error to page console.error("username taken"); } else { //response must be 201- //errors caught above //log them in localStorage.setItem ("access_token",response.access_token); loggedInChecker(); history.push("/welcome"); } }); }; ``` --- <!--Terry--> ## If we had more time - Finish off the routes to send info back and render it on the page - Add more functionality (ZEN FLOAT!!) - Sleekify :haircut: --- <!--Ephie--> ## Tricky bits - Setting up Travis to work with a test database. - setting up codecov (I just gave up). - Figuring out how much we could do in the time we had - Styled components gives you a weird automated className that is tricky. --- <!--Ephie--> ## Interesting Things we learnt - `.json` rips out metadata - no status code - mystery no-cors mode... what will it do? Break or fix- spin the wheel to find out! ---  --- ## What we're proud of - The fade style component! - Cypress testing - Making it responsive - Tenacity through the endless bugs :spider: - Focus on learning - Pie Chart plugin --- <!--Terry--> ## Tech Stack - ReactJS - styled-components - PostgreSQL - Express - CSS - Design Tools - Miro - Figma - Whimsical ---  ---