Closed atulbhatt-system32 closed 6 months ago
Hi @atulbhatt-system32,
Quick question about the tech stack for the project:
Your input is much appreciated!
Cheers, FreeAPI Team
Hi @wajeshubham Thanks for the follow-up.
Some good points you mentioned regarding my tech stack choices. Let me break down your questions in the sequence of project requirements.
I chose Zustand because it's lightweight when compared to redux. It may be required for storing (with persist) themes, user (browser with origin and port - not actual logged-in user) scores on quizzes, and keeping overall stats of user activities if required. Adding it later will not sync with the project name.
Of course it can be a single-screen App. However, I want to keep improving the project and add more use cases. There will be another screen for Quiz sections.
It's in progress, give me a day or two to present something on that. I will share the link here to Figma with some wireframes or designs. I hope that works.
If you want I should first plan everything for the project and then create an issue I can also do that.
@atulbhatt-system32 First off, kudos on considering the addition of a Quiz section! That's an exciting feature that can truly enhance user engagement and provide an interactive learning experience. I'm looking forward to seeing the wireframes or designs on Figma.
Regarding Zustand, your point about its lightweight nature compared to Redux makes a lot of sense. It's great to know that you've already thought about potential use cases like storing themes, user scores, and overall activity stats.
As we delve into the Quiz section, I'm curious about exploring whether we could leverage the Context API for state management. Since the state requirements for quizzes may not be overly complex or spread across the entire app, this might provide a simpler alternative. What are your thoughts on this approach?
Best regards, FreeAPI team
@wajeshubham I will get back to you with the wireframes and using context instead of zustand.
@atulbhatt-system32 Thanks! Just to add, we are not too much focus on the design. So, just a basic low fidelity to get an idea about flow is enough 😀. And you can use cooked in components from shad cn or some equivalent UI library without designing your own design in figma.
Looking forward to see this app in action. 🚀
@wajeshubham definitely plan is to use shadcn
@wajeshubham
Here's the progress of Figma.
I'm not a designer so just a skeleton here. But I also want to learn things while building this so trying to make a proper Figma design with Auto Layout. After the skeleton is complete I will add colors and stuff too to the figma before I code anything. I hope there's no rush in completing this application.
@atulbhatt-system32 looks great! You can refer to the DevUI. We are continuously shipping application UI designs there. You can get some assistance on UI components there 😀.
Thanks @wajeshubham
I think these designs can help me pick basic colors. Are they from chai and code backend series?
Yes but this application also has some other app screens like social media, todo, chat app, auth screen. So, you can use UI components from these designs and get the app up and running without designing your own UI.
@wajeshubham understood. Yeah, I checked it. There are some pre-made components in it. Cool thing. I mean what if I want to try some designing by myself? That's why wanted to know if there is some requirement to get the project done ASAP.
There's no deadline, we just suggest you to use something pre cooked so you can focus more on business logic and project completion but if you are interested in designing your own UI we are open for that as well.
There's no deadline as this is an open source project, you can build it at your own pace 😀 but yes, one thing to keep in mind is, keeping this issue open for too long is not feasible.
@wajeshubham understood. Development will be fast that I ensure. Also, we will have to raise PR when the entirety of the project is done right?
You can open it when you push your first commit to the feature branch of your forked repository of api hub. We will mark it as a draft PR until you submit it for the final review.
Thanks
@wajeshubham
how's the flow of the application?
I will start building now and then pick up the quiz section in v2. Is it possible?
@atulbhatt-system32 looks great 👍🏻, just one question, In the details of status code you are including examples of all the request methods which is not included in the FreeAPI status code api response. Let us know how you are planning to approach it?
We are also open for contributions in the core status code module of the FreeAPI where you can include these examples in the api itself.
Talking about content of the following screen:
@wajeshubham This is a flow of what I want my design to look like. The actual implementation will be a little different. First I will create the minimum implementation and then of course I am also willing to contribute to backend apis
@atulbhatt-system32 Sounds good!
@wajeshubham are these changes still open? Would you like me to work on it? Of course Im new to this repo. Im a FSD by profession. If you could reply would be better.
@wajeshubham I will pushing updates today.
@wajeshubham where can I find the API for the same? I haven't found it in the the apihub
repo. If this doesn't exist I can complete it without API and then make the backend too later or someone else can pic k the backend.
For now I'll be using this link to fetch the data: /codes.json
It's in the kitchen sink already. Please find it here: https://api.freeapi.app/#/%F0%9F%9A%B0%20Kitchen%20Sink/getAllStatusCodes
@wajeshubham thanks. I pushed one page completed with API integration. The pages shows all the codes list. I will be finishing the next page by the end of next week. Currently I'm overloaded with some projects so couldn't spare much time.
But I'm sure I will be able to complete the search code page before weekend probably.
Shall I move out the PR from draft or do it next week.
@atulbhatt-system32 Once you think that the PR is ok for review you can remove it from draft and request a review from us.
PR: #91
Frontend App Title
statuscodes
Overview
To offer users a comprehensive understanding of various HTTP status codes.
Technologies to be Used
Detailed Features
1. Code Lookup:
2. Detailed Explanations:
3. Elegant User Interface:
4. Search and Filter:
5. Examples and Case Studies:
6. Regular Updates:
Tech Stack Used
ReactJs, Zustand, tailwindCss, Shadcn
Built For Platform
web
Project Path
$ROOT_FOLDER/examples/kitchen-sink/statuscodes/web/react-shadcn-tailwind-zustand