In this video, Emmanuel Henri demonstrates how to add a component from code and starts exploring the code behind the component in Visual Studio Code.
- [Instructor] So let's work on our first code component, … so our react component. … One of the first item that you absolutely need … to work in code is a good code editor … and the one I recommend is VS Code. … We installed it earlier in this course, … but if you don't have it installed, … please pause the video and go back to the video … where we install it. … Now that we have VS Code installed, … let's go and create our first code component. … The way you do this, you go to components first, … then click on new, and then instead of from design, … select from code, and then what we're going to do … is call this TitleCard like so, … and then click create and edit. … So this should create a title card … and automatically open your editor, so VS Code in my case. … And now that VS Code is open, you're going to see … your actual component. … So let's go and close the explorer, … and this is what it looks like in code. … So you have all the properties that are basically … your styles, and the props, so we have a prop that says …
- What is Framer X?
- Navigating the user interface
- Designing with Framer X
- Working with the layout and drawing tools
- Building interactions
- Creating simple and complex components
- Implementing overrides
- Exporting your prototype
Skill Level Intermediate
Prototyping AR User Experiences with Framerwith Emmanuel Henri51m 50s Intermediate
1. Framer X Overview
2. Design with Framer X
3. Build Interactions with Framer X
4. Create Simple Components
5. Create Complex Components
6. Advanced Features in Framer X
Next steps1m 21s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.