GithubHelp home page GithubHelp logo

freedreamer-crypto / framer30-code Goto Github PK

View Code? Open in Web Editor NEW

This project forked from hermy0211/framer30-code

0.0 1.0 0.0 65.25 MB

Code from the framer 30 project

TypeScript 98.62% CSS 1.38%

framer30-code's Introduction

30 Days of Framer X Code

Table of Contents

Introduction

This repository stores the code for all of my 30 Days of Framer X projects, so you can start building a similar project on your own.

Not all of the functionality was built on code alone. Please refer to the instructions below and my Medium posts for a brief overview to see how the code and design fits in together.

If you have any questions, feel free to contact me at [email protected].

All of my work is free to use, as long as it is not used for commercial purposes.

Download

Download ZIP File

  1. Click on the Clone or Download button on the top right.
  2. Click on Download ZIP. Please note that if you download the ZIP file, you will not receive automatic updates to whatever changes I make. You will have to re-download all of the projects on your own.

Download via Terminal

  1. Open the terminal and cd into the folder you wish to download to.
  2. Run git clone https://github.com/hermy0211/framer30-code.git.

View Project

Learn how the project is put together by connecting the components and overrides I have written to the design elements on screen. Learn more about components and overrides by clicking on each link.

Viewing code files

  1. Download the project.
  2. Open the .framerx file.
  3. Open the project folder with Option + Command + P.
  4. Open the code folder to view the .tsx files that I have created.

Issues and Contributing

Known Issues

Below is a list of known issues that I will tend to in the future.

  • Project 05 : The perspective and rotate3d are updated asynchronously sometimes.
  • Project 07 : Color change animation is glitchy.
  • Project 10 : Only works for the topmost element.
  • Project 17 : Only the 'Grocery' and 'Personal' categories have corresponding lists.
  • Project 19 : Only works for the lowercase and space keys. There is also no text cursor.
  • Project 23 : The clipping animation transition for when the story is opened is not smooth.

If you would like to suggest an update of your own, please submit it as a pull request and I will see if it seems adequate.

Submitting a Pull Request

  1. Create a feature branch: git checkout -b project-suggestion
  2. Commit your changes: git commit -m "Explain Feature"
  3. Push to the branch: git push origin project-suggestion
  4. Submit a pull request. Please note that this only works if you have forked the repository.

framer30-code's People

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.