Hi there!
It is a log of my development process.
I decided to write down all my thoughts and decisions in a log.
Each title is a commit
I'm setting up an application comprising both frontend and backend. To speed up the setup, I've considered the following boilerplates:
About npx express-generator: I noticed it was a bit outdated, primarily utilizing older syntax (like CommonJS). To
modernize the codebase,
I updated it to leverage ES6 syntax and removed unnecessary (for me) libs and files.
I quickly made a draft working code for the backend in few files.
Funny, it's a Nodejs task, but the frontend work is twice as much 😅 I made a plan for myself, and it looks exactly like this.
Because project is small, I've chosen to implement the MVC architecture pattern.
Additionally, I added
- ./core - code for start application
- ./libs - collection of utilities, organized into directories in a DDD-like fashion
For simplicity, I decided to omit certain entities, such as Middlewares, Services, and etc., distributing them among the existing ones
I decided to skip the tests for now, as I'm not sure if I'll have enough time to write them.
I've added a frontend MVP, which is a simple form with a single input and a button.
The weirdest thing is that it worked on the first try. Spent 20 minutes, haha.
Last time I tried Redux (https://github.com/AndreiSoroka/cart-component/tree/master), and I can say that I didn't like Redux. That's why I decided to try MobX, and it turned out to be very, very interesting.
I created a store where the logic for working with messages is encapsulated:
- Storing messages
- Sending messages
- Retrieving messages
- Handling errors
For now, I've simply drafted the code without giving it much thought. I'll likely refactor it later, depending on the time.
Hi there! Today, I integrated Ant Design into the project. I've previously used it with Vue.js (and it wasn't a great fit for Vue.js). However, this is my first time using it with React. I must say, this component library works well with React! :)
Of course, I spent some time on AntD + MobX and encountered a few pitfalls.
I've decided to use the FSD methodology.
The first time I tried it was here: https://github.com/AndreiSoroka/cart-component/tree/master. However, I only truly appreciated this structure later on.
The project is working. Now I need to decide what I want to showcase in the test assignment.
- Code quality?
- Architecture?
- Structure?
- Features?
- Design?
I still have 4 days left (out of 7), but this time I don't have much free time to even dedicate a full working day to it.
I will make a decision tomorrow
My motto is:
If it's not automated, it's subjective.
It doesn't matter to me in what code style to write, the main thing is that in one style
To ensure the code follows a consistent style, I've added Prettier.
A bit more automation. I've added Husky to run Prettier and Eslint before each commit.
Just fix bug
Today is deadline when I can dedicate time to the project.
I've decided not to focus on the code anymore, as it can always be improved endlessly. Instead, I've focused on streamlining the setup process. That's why I've consolidated everything using Docker Compose.
You can take a look at slightly more organized code in my previous test-task.
I approached each project differently. For instance, here:
- I tried writing this log, step by step, detailing how I approached the project.
- I decided not to overthink the architecture and just start coding (which turned out to be fun and quite fast).
- I chose to skip writing tests (usually, I develop tests firstly and then the code).
- I decided not to use Storybook (I create components in Storybook and then integrate them into the app).
- I tried MobX, and I liked it more than Redux.
And once again, I'll remind you that I'm not a React developer. The code lacks reviews (yes, I didn't even codereview it myself). And this was a test task :) And I enjoyed it.
Have a nice day and kind regards
