DEV Community: Jimmy

Challenge 2 : Crappo Crypto currencies

Jimmy — Thu, 20 May 2021 08:48:31 +0000

Welcome to the second challenge 🚀
I will really proud if you enjoy to follow me in this crazy adventure.
Each challenge will be organize of the same way : description about the project, roadmap to scope the project, deployment and of course clear documentation.

Github project
Demo

Project overview 📝

The goal of this project is to build a landing page for your crypto currencies. A demo is available to see the result.

What I wanted to do 👷‍♂️

Templating Html/Css from FigmaCrush template
Responsive even if no mobile version in the Figma template
Animate each section of this beautiful landing page

Technologies used 🛠

For this project, I decided to focus on the use of these technologies :

What I learned 👀

Every project is different and it's always exciting to find out why.

[Html5] Before to create the style of your design, I recommend you to create the entire of your html and follow a naming convention. In my case, I try to respect BEM as best as possible.

[Sass] Organize a project is really important when you need to paralyze your tasks and more easy for your responsive.

[Parcel] I wanted to practice Parcel.js because it's a blazing fast, zero configuration web application bundler. I had heard of it but not had the opportunity to use it. This is now the case :)

Improvements 🛫

I think it could be nice to improve this project nope ? What do you purpose for this ? I have another ideas, but I'm curious to know yours 😀

Feel free to let me your comments 🙏 ❤

Thanks a lot to join me on this adventure and to follow me. 🤩 Continue to learn and practice by the same way. 🚀

Challenge 1 : Card Wallet

Jimmy — Fri, 14 May 2021 08:11:45 +0000

Welcome to the first challenge 🚀
I will really proud if you enjoy to follow me in this crazy adventure.
Each challenge will be organize of the same way : description about the project, roadmap to scope the project, deployment and of course clear documentation.

Project overview 📝

The goal of this project is to build a card wallet and manage recent payment entries. A demo is available to see the result.

Define your roadmap 🖊

To realize this project, i started to create a projet into my Github called vue-card-wallet.

Github permits you to define a roadmap for your project as you can see here :

Before to start to code, it's really important to define the scope of your project. You got the design, and the features but you need to put a limit.

Create your roadmap to structure your ideas, and organize them through a priority order. I recommend that you rank in ascending order from most to least important.

What I wanted to do 👷‍♂️

Templating Html/Css from FigmaCrush template
Responsive even if no mobile version in the Figma template
Create Card component to add a card in your wallet
Manage recent payment (add and delete) with animation

Technologies used 🛠

For this project, I decided to focus on the use of these technologies :

What I learned 👀

Every project is different and it's always exciting to find out why.

[Vue3] In this one, there is a lot of discovery in practice on Vue3 with TypeScript. But also the use of API composition to allow code reuse.

[CSS] Animation is a good way to improve your user experience. So simple and so fun to create. I wanted to experiment it through transition-group

[TailwindCss] I also discovered some utilities classes in TailwindCss and customize the font-family.

Improvements 🛫

I think it could be nice to improve this project nope ? What do you purpose for this ? I have another ideas, but I'm curious to know yours 😀

Feel free to let me your comments 🙏 ❤

Thanks a lot to join me on this adventure and to follow me. 🤩 Continue to learn and practice by the same way. 🚀

Develop your full potential through UXCrush Resources

Jimmy — Fri, 14 May 2021 06:17:38 +0000

Presentation

Figma is an incredible tool as a frontend developer. You could see in detail the design before to code it.

UXCrush is a curated collection of Figma resources: UI kits, icons, website templates and all sorts of freebies created and shared by the Figma community.

Interested no ?

You want to develop something but you have no idea to do ?
You want to apply a technology on a new project but you have no idea to do ?

Through multiple UXCrush resources, you don't need to think about the idea of the project. You just to select the project you enjoy and stay focus on what you really want to do : learn & code ❤️ ❤️

UXCrush Resource

So simple to get a figma resource and open it :)
I don't know how many page there is but you have the choice.

You will probably want to download multiple projects and select one of them after. Keep in mind, several selected projects is good but a completed project is better.

Import them into your figma and you will get ready to start your new project :)

Conclusion

It's probably an excellent resource if you want to start to create a project without idea. And there is something for every taste : desktop landing / mobile app / ...

All feedbacks are welcome ❤️
Maybe you have already try these resource ? Do not hesitate to tell me in the comments and get READY for the first challenge 🚀

Never stop to learn but practice

Jimmy — Thu, 13 May 2021 13:17:43 +0000

Learn learn learn

As a frontend developer, you need to learn constantly to follow the technology but almost to increase your skills.

But why ?

I'm confortable into my job and i like my current language.

This answer isn't entirely acceptable for some reasons :

Do you understand completely your language ?
Are you not curious to discover some tips and tricks ?
How could you offer your expertise on a new project ?
Questions list could be longer...

Follow a technology or some tutorial is not enough. Listen is not enough, you need to practice to increase your skills. This is the observation that I made after several months of reading blogs.

Learn ok but how to practice without project ?

Yeah, for some developer like me, it's hard to develop a website without a visual destination and a real objective.

Yeah, I want to learn some things like CSS animation because I can't into my current job (animation is useless for some persons).

Yeah, I want to train on Vue3 the latest big feature Composition API.

For all of these reflexion, i try to found multiple project to learn and practice by the same occasion.
Anyone could join myself through an experimentation code on some challenges. An entirely series will be dedicated to present the ultimate resource and challenges for each of one.

I will purpose many challenges in different technologies thanks to your feedback. The idea behind this is :

to learn together (even if we use the same language, we could improve our knowledge through the code of someone else)
to compare challenges results (on the challenge, i will list of all your project)
collaborate on a challenge through Pull Request (improve UX/UI, improve readable code, ...)

But Stay focus

If you like me love to reading posts on dev.to, you may have already lost yourself through the immensity of the number of interesting posts.

I know it's hard as exercise. But to progress, you need to stay concentrate and work synchronous on a task. Don't be asynchronous, because you will lost much of time.

Conclusion

Whether you are freelance, in a job, or in training, never stop learning and stay curious. Even if you are only few minutes in the week, it's always a benefit for yourself of the future.

Any feedbacks are welcome to discuss ❤️