While building my project (Quotix), which I'm using to learn and apply my knowledge in Mobile Development using Expo (React Native Framework), I sometimes have to:
- Jump back again to the docs
- Search for a particular component
- Take note of the props that suit my needs
- Hop back to the IDE
Phew! I'm thrilled to share that I've just published my first VSCode extension on the Marketplace (React Native and Expo Code Snippets). 🎉
Motivation
As a newcomer to React Native with Expo, I found it tiring to constantly switch between my editor and the documentation to check component props. This inspired me to create an extension that streamlines this process.
The Game Changer for me!
With my extension, developers can simply type _exp or _rn to access a list of code snippets, including basic and full props for components (React Native or Expo-specific). It's a fantastic way to enhance productivity and keep the development flow uninterrupted. 💡💻
With more than 70+ (and counting) snippets for many of the components, or implementations for (ContextApi, Location, Camera, Permissions), now you can speed up your development process. No need to try to remember the props; just type _rn or _exp for IntelliSense to trigger the component you want, and you pick out what you need and toss out what you don't.
Get the Extension Now and Try it out
If you're a React Native or Expo Developer, you will find this extension useful, as I have too.
Wanna Try building your Own Extension?
If you're feeling adventurous and would like to create productivity-aiding tools for your development environment. It's quite easy.
- Install the
Yeoman
andVSCode Extension Generator
npm install -g yo generator-code
- Generate the extension project
yo code
Follow the prompt to choose the type of project you want to work on.
- Define your snippets in the
snippets.code-snippets
file using the snippet language, kindda like json (you can look up the repository for the extension to get an idea of how it's done and the general project structure @ https://github.com/Cre8steveDev/React-Native-and-Expo-Code-Snippets
Learning Resource:
Top comments (1)
Great Post