This project introduces you to a more advanced tool for creating your web applications: the micro-framework. You will have to create, in the language of your choice, a dating site (🍆 💦 🍑).
Can't believe it, but it's done. Never thought this project was gonna require such amount of effort. On paper it was supposed to be done in one month, but no way someone without previous full-stack web development experience can achieve that. Things I take home:
- Pretty decent knowledge of the SPA paradigm.
- Realization that project based learning is what really works. The way of 42 is a bit painful, but what doesn't kill you makes you stronger.
- Little bit of ptsd 😻 (but I've been told by other matcha survivors, it only lasts a couple of days).
Since in my previous project I used the MVC software architectural pattern, this time I wanted to test another different but nowadays popular approach: SPA (short for Single-page application). The intention behind this choice was to become familiar with the most common paradigms used today in Web development.
In an SPA, a page refresh almost never occurs; instead, all necessary HTML, JavaScript, and CSS code is downloaded once, the very first time the user loads the site. From there on, all user interaction is handled by a modern JavaScript framework, which dynamically rewrites the web page, with new data retrieved from the web server.
In a SPA, all data interchanges with the server are done using Ajax. The data itself is encoded into JSON strings before being sent, and decoded on each end once received.
So the big picture for this project can be described in two parts:
A backend web API, made from scratch using PHP.- A backend web API, made using Express.js (tried to keep it RESTful, but I may have let Mr. Fielding down 😓).
- A JS framework in the frontend to take care of the rest. This time I went with React.
Below I grouped in sections the personal notes I took while working on this project:
- Docker set up
- About RESTful APIs
- Routing requests
- App setup
- Authentication: JSON web tokens
- Front-end
- Implement advance search/filters.
- Infinite scroll would be nice.
- Fix the scroll up, in profile list, when new users are added to state.
- Give it a go to https, so we can use
SecureandSameSite=None; also for setting properly the refresh token in the hard cookie. - Eliminate duplication in the models (Account, Settings, Profiles basically deal with the same thing).
- Update these notes!