Lucas Debeterco.

Devstore

In this application, the objective was to use the concepts introduced from Next 13 by developing an e-commerce application. The main concepts applied were Server Components, SSR, Suspense API, caching (with revalidation) and a internal API. In this application I also used Cypress to perform E2E tests of the interface.

Pizza Shop

Dashboard made with React.js and Tailwind for managing a restaurant and handling order management, similar to the iFood app. In this project, I learned a lot about integrating a frontend app with an external API. All API communication were made using React Query for the requests, caching, and implementing optimistic UI. The optimistic UI concept was a fantastic approach that I had not worked with before, and it was exciting to build an application using it. Additionally, I applied multiple testing methods, using testing-library/vitest for unit testing and Playwright for E2E testing. Another interesting library I used was Recharts, which I applied to create graphs.

Buscapeca (Final Paper)

Coffee Delivery

Application to manage a fictional coffee shop, where I was able to apply the concepts of Context-API to store items in the cart, routing with React router dom and searching for the user location through a third-party API. Developed using React.js, Typescript and Styled Components.

Letmeask (NLW Together)

Application made with React.js and Typescript, with the objective of developing a question room center, where users can create rooms, share them with other people and register their doubts. Admin users can highlight a question or close it when it has been answered. All data persistence and deployment was done using Firebase tools (Realtime Database and Firebase Hosting).

Blog Router (Alura)

Basic project to practice the concepts of the React Router DOM library, the application is a personal blog for listing articles in React.js and Typescript.

Ignite Timer

Application for time management, allows you to create a task and count the time spent developing each task. The application was developed using React.js and Styled Components. In this project, I used libraries such as Zod to validate typing based on schemas and Immer to work with immutable states in an easier way.

Github Blog

Development of an application that consumes the GitHub API to fetch issues from a repository, data from your profile and display them as a blog. The application presents the profile with image, number of followers, name and other information available through the GitHub API, listing and filtering repository issues and a page to display the details of each post (issue).

ToDo List

Simple web page to manage creation and removal of tasks using localStorage.

ES Converter

ECMAScript5 to ECMAScript6 converter, created to alleviate some situations I went through at work, where I needed to convert code generated by an old bundler to a newer version of ECMAScript.

NLW E-Sports

Find your DUO project, development environment with Node, React and mobile (React Native). It is a register of advertisements that allow the user to find a DUO based on the information in the advertisement, such as game, time and discord.

Aluroni

Restaurant application, React, Typescript and CSS Modules. Application with meals search input, filters by category (pasta, meat..), sorting by price, portion, etc.

Ignite Feed

Ignite feed is a simple project that simulates the social media feed, with comments, likes and delete comments functionalities. Made with React, Typescript and CSS Modules.

ESLint Config

This is the standard package that I have made and use in my personal projects for ESLint configurations in React.js and Next.js, it contains formatting rules, spacing, imports and various settings for code formatting. The main challenge of this project was my first contact with creating and making a package available on NPM. After carrying out this personal project, I replicated the concept in the company, and now we have a configuration package also within the Frontend team, that is used in all React projects.

Alura Space

Project developed during an Alura platform course, with the main objective of creating filters with Javascript. Developed with React.js and SASS

DT Money

This project was made to create a financial control for the user. The user can add their day-to-day financial inflows and outflows. You can also use the search field to filter by specific items or categories. This application was created using React.js and Typescript and Tailwind, the forms were made with react-hook-form and zod for validations.